diff --git a/README.md b/README.md index 4dfc72aa8a5..ceb93f156b5 100644 --- a/README.md +++ b/README.md @@ -57,3 +57,11 @@ to: With this approach we can benefit from what is best from those two worlds. We can use SCSS syntax for mixins, variables etc. and still have our rules scoped to the component ;) How to use it? Since there is no global scope we need to implicitly import our variables/mixins etc. Check the `src/Components/App/style.scss` file. On the first line it imports the shared styles with variables and mixins. + +#### 4. How do I import global styles from third-party packages? +Importing any stylesheet from JS (with CSS Modules enabled) will convert class names into unique identifiers. By design, this prevents them from being used for global styles. If you have, say, a third-party component that provides some "regular" SCSS/CSS code, you will want to import it from an SCSS file instead, like so: +``` +:global { + @import '~react-select/dist/react-select'; +} +```