create-react-app
create-react-app copied to clipboard
Global styles from third party library are not applied properly
Is this bug?
Yes
Reproduce bug
Repository with bug example: https://github.com/RusinovAnton/cra-global-styles-bug-example
Problem Description
I've just tried to use react-table and import styles for it the way it described in README
There are two problems with it:
- Import path - if I use styles as it described in README
:global {
@import '~react-table/react-table.css';
}
then it fails to import because CRA configured for absolute paths root to be src/
so I get following error:
Module not found: Can't resolve '~react-table/react-table.css' in '/Users/rusinov/projects/nodus/cra-global-styles-bug/src/components/App'
- Styles imported as CSS modules - When I fix import by removing "~" char from import path I get styles loaded on page but they are transformed as CSS modules.
:global {
@import 'react-table/react-table.css';
}
Expected behavior
Third party styles are not transformed as CSS modules when imported within :global
directive