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: README.md
+43-13
Original file line number
Diff line number
Diff line change
@@ -20,7 +20,9 @@ The `css-loader` interprets `@import` and `url()` like `import/require()` and wi
20
20
21
21
## Getting Started
22
22
23
-
> ⚠ To use css-loader, webpack@5 is required
23
+
> **Warning**
24
+
>
25
+
> To use css-loader, webpack@5 is required
24
26
25
27
To begin, you'll need to install `css-loader`:
26
28
@@ -402,7 +404,9 @@ The loader replaces local selectors with unique identifiers. The chosen unique i
402
404
}
403
405
```
404
406
405
-
> ℹ️ Identifiers are exported
407
+
> **Note**
408
+
>
409
+
> Identifiers are exported
406
410
407
411
```js
408
412
exports.locals= {
@@ -455,7 +459,9 @@ exports.locals = {
455
459
456
460
To import a local classname from another module.
457
461
458
-
> i We strongly recommend that you specify the extension when importing a file, since it is possible to import a file with any extension and it is not known in advance which file to use.
462
+
> **Note**
463
+
>
464
+
> We strongly recommend that you specify the extension when importing a file, since it is possible to import a file with any extension and it is not known in advance which file to use.
459
465
460
466
```css
461
467
:local(.continueButton) {
@@ -1103,9 +1109,13 @@ Default: `false`
1103
1109
1104
1110
Enables/disablesESmodulesnamedexportforlocals.
1105
1111
1106
-
> ⚠ Namesoflocalsareconvertedtocamelcase, i.e. the`exportLocalsConvention`optionhas`camelCaseOnly`valueby default.
1112
+
> **Warning**
1113
+
>
1114
+
> Namesoflocalsareconvertedtocamelcase, i.e. the`exportLocalsConvention`optionhas`camelCaseOnly`valueby default.
> ⚠ You don't need [`style-loader`](https://github.com/webpack-contrib/style-loader) anymore, please remove it.
1516
-
> ⚠ The `esModules` option should be enabled if you want to use it with [`CSSmodules`](https://github.com/webpack-contrib/css-loader#modules), by default for locals will be used [named export](https://github.com/webpack-contrib/css-loader#namedexport).
1527
+
> **Warning**
1528
+
>
1529
+
> You don't need [`style-loader`](https://github.com/webpack-contrib/style-loader) anymore, please remove it.
1530
+
1531
+
> **Warning**
1532
+
>
1533
+
> The `esModules` option should be enabled if you want to use it with [`CSSmodules`](https://github.com/webpack-contrib/css-loader#modules), by default for locals will be used [named export](https://github.com/webpack-contrib/css-loader#namedexport).
1517
1534
1518
1535
The default export is `string`.
1519
1536
@@ -1542,10 +1559,21 @@ console.log(sheet);
1542
1559
1543
1560
#### `'css-style-sheet'`
1544
1561
1545
-
> ⚠ `@import` rules not yet allowed, more [information](https://web.dev/css-module-scripts/#@import-rules-not-yet-allowed)
1546
-
> ⚠ You don't need [`style-loader`](https://github.com/webpack-contrib/style-loader) anymore, please remove it.
1547
-
> ⚠ The `esModules` option should be enabled if you want to use it with [`CSSmodules`](https://github.com/webpack-contrib/css-loader#modules), by default for locals will be used [named export](https://github.com/webpack-contrib/css-loader#namedexport).
1548
-
> ⚠ Source maps are not currently supported in `Chrome` due [bug](https://bugs.chromium.org/p/chromium/issues/detail?id=1174094&q=CSSStyleSheet%20source%20maps&can=2)
1562
+
> **Warning**
1563
+
>
1564
+
> `@import` rules not yet allowed, more [information](https://web.dev/css-module-scripts/#@import-rules-not-yet-allowed)
1565
+
1566
+
> **Warning**
1567
+
>
1568
+
> You don't need [`style-loader`](https://github.com/webpack-contrib/style-loader) anymore, please remove it.
1569
+
1570
+
> **Warning**
1571
+
>
1572
+
> The `esModules` option should be enabled if you want to use it with [`CSSmodules`](https://github.com/webpack-contrib/css-loader#modules), by default for locals will be used [named export](https://github.com/webpack-contrib/css-loader#namedexport).
1573
+
1574
+
> **Warning**
1575
+
>
1576
+
> Source maps are not currently supported in `Chrome` due [bug](https://bugs.chromium.org/p/chromium/issues/detail?id=1174094&q=CSSStyleSheet%20source%20maps&can=2)
1549
1577
1550
1578
The default export is a [constructable stylesheet](https://developers.google.com/web/updates/2019/02/constructable-stylesheets) (i.e. [`CSSStyleSheet`](https://developer.mozilla.org/en-US/docs/Web/API/CSSStyleSheet)).
1551
1579
@@ -1654,7 +1682,9 @@ For `production` builds it's recommended to extract the CSS from your bundle bei
1654
1682
This can be achieved by using the [mini-css-extract-plugin](https://github.com/webpack-contrib/mini-css-extract-plugin), because it creates separate css files.
1655
1683
For `development` mode (including `webpack-dev-server`) you can use [style-loader](https://github.com/webpack-contrib/style-loader), because it injects CSS into the DOM using multiple <style></style> and works faster.
1656
1684
1657
-
> i Do not use `style-loader` and `mini-css-extract-plugin` together.
1685
+
> **Note**
1686
+
>
1687
+
> Do not use `style-loader` and `mini-css-extract-plugin` together.
0 commit comments