Skip to content

Commit ace861e

Browse files
feat: esModule option
1 parent 23bc1e9 commit ace861e

18 files changed

+725
-896
lines changed

README.md

+29
Original file line numberDiff line numberDiff line change
@@ -118,6 +118,7 @@ module.exports = {
118118
| **[`importLoaders`](#importloaders)** | `{Number}` | `0` | Enables/Disables or setups number of loaders applied before CSS loader |
119119
| **[`localsConvention`](#localsconvention)** | `{String}` | `'asIs'` | Style of exported classnames |
120120
| **[`onlyLocals`](#onlylocals)** | `{Boolean}` | `false` | Export only locals |
121+
| **[`esModule`](#esmodule)** | `{Boolean}` | `false` | Use ES modules syntax |
121122

122123
### `url`
123124

@@ -857,6 +858,34 @@ module.exports = {
857858
};
858859
```
859860

861+
### `esModule`
862+
863+
Type: `Boolean`
864+
Default: `false`
865+
866+
By default, `css-loader` generates JS modules that use the CommonJS modules syntax.
867+
There are some cases in which using ES modules is beneficial, like in the case of [module concatenation](https://webpack.js.org/plugins/module-concatenation-plugin/) and [tree shaking](https://webpack.js.org/guides/tree-shaking/).
868+
869+
You can enable a ES module syntax using:
870+
871+
**webpack.config.js**
872+
873+
```js
874+
module.exports = {
875+
module: {
876+
rules: [
877+
{
878+
test: /\.css$/i,
879+
loader: 'css-loader',
880+
options: {
881+
esModule: true,
882+
},
883+
},
884+
],
885+
},
886+
};
887+
```
888+
860889
## Examples
861890

862891
### Assets

0 commit comments

Comments
 (0)