Skip to content

Fix import order of Bootstrap and our CSS#116

Merged
dsmmcken merged 2 commits intomainfrom
mattrunyon_102_b
Jul 16, 2021
Merged

Fix import order of Bootstrap and our CSS#116
dsmmcken merged 2 commits intomainfrom
mattrunyon_102_b

Conversation

@mattrunyon
Copy link
Collaborator

@mattrunyon mattrunyon commented Jul 15, 2021

Fixes #102

This should ensure that bootstrap's classes are always included earlier than all of our CSS in both OSS and Enterprise.

This is the OSS part of the enterprise fix. The bug occurs in enterprise when using a production build.

To test locally, copy the packages/components folder into enterprise at node_modules/@deephaven/components. Symlinking won't work properly. Then do a build and use something like serve -s build -l 3000 (npm module) to test the production version of enterprise.

The CSS should be correct. Easy one to find is the table menu buttons are way too big if the import order is wrong.

@mattrunyon mattrunyon requested a review from dsmmcken July 15, 2021 23:08
@mattrunyon mattrunyon self-assigned this Jul 15, 2021
@mattrunyon mattrunyon changed the title Fix CSS Import Order in Production Fix import order of Bootstrap and our CSS Jul 15, 2021
@mattrunyon mattrunyon added bug Something isn't working web-client-ui labels Jul 15, 2021
"clean:modules": "lerna clean --yes",
"clean": "npm run clean:build && npm run clean:modules",
"bootstrap": "lerna bootstrap --hoist -- --no-audit --prefer-offline",
"bootstrap": "lerna bootstrap --hoist --nohoist=bootstrap -- --no-audit --prefer-offline",
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

what's the purpose of this?

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

custom.scss imports from the Bootstrap version in node_modules. Since we're shipping that scss file to enterprise without compiling it, it still needs to be able to import Bootstrap. Sass has no real module resolution, so in OSS the import would be 3 or 4 levels up, but in enterprise it would be just 2 levels up if bootstrap were also installed to enterprise.

Nohoist emulates the package structure (with regular dependencies) when installed via npm. So importing ../node_modules/boostrap/... will work in OSS and enterprise as both will have bootstrap in the components node_modules folder

@dsmmcken dsmmcken merged commit 4b00e1e into main Jul 16, 2021
@dsmmcken dsmmcken deleted the mattrunyon_102_b branch July 16, 2021 21:23
@mofojed mofojed mentioned this pull request Jul 20, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

bug Something isn't working web-client-ui

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Fix import order of Bootstrap and our CSS

2 participants