You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: packages/react-scripts/template/README.md
+4-3Lines changed: 4 additions & 3 deletions
Original file line number
Diff line number
Diff line change
@@ -24,6 +24,7 @@ You can find the most recent version of this guide [here](https://github.com/fac
24
24
-[Importing a Component](#importing-a-component)
25
25
-[Code Splitting](#code-splitting)
26
26
-[Adding a Stylesheet](#adding-a-stylesheet)
27
+
-[Adding a CSS Modules stylesheet](#adding-a-css-modules-stylesheet)
27
28
-[Post-Processing CSS](#post-processing-css)
28
29
-[Adding a CSS Preprocessor (Sass, Less etc.)](#adding-a-css-preprocessor-sass-less-etc)
29
30
-[Adding Images, Fonts, and Files](#adding-images-fonts-and-files)
@@ -513,11 +514,11 @@ In development, expressing dependencies this way allows your styles to be reload
513
514
514
515
If you are concerned about using Webpack-specific semantics, you can put all your CSS right into `src/index.css`. It would still be imported from `src/index.js`, but you could always remove that import if you later migrate to a different build tool.
515
516
516
-
## Adding a CSS Modules based stylesheet.
517
+
## Adding a CSS Modules stylesheet
517
518
518
519
This project supports [CSS Modules](https://github.com/css-modules/css-modules) alongside regular stylesheets using the **[name].module.css** file naming convention. CSS Modules allows the scoping of CSS by automatically prefixing class names with a unique name and hash.
519
520
520
-
An advantge of this,is the ability to repeat the same classname within many CSS files without worrying about a clash.
521
+
An advantage of thisis the ability to repeat the same classname within many CSS files without worrying about a clash.
521
522
522
523
### `Button.module.css`
523
524
@@ -555,7 +556,7 @@ No clashes from other `.button` classnames
555
556
<divclass="Button-module__button___1o1Ru"></div>
556
557
```
557
558
558
-
**This is an optional feature.** Regular stylesheets and imported stylesheets are fully supported. CSS Modules are only added when explicted named as a css module stylesheet.
559
+
**This is an optional feature.** Regular stylesheets and imported stylesheets are fully supported. CSS Modules are only added when explictly named as a css module stylesheet using the extension `.module.css`.
0 commit comments