style loader module for webpack
npm install styletext-loaderstyletext-loader:
console
npm install --save-dev styletext-loader
`
It's recommended to combine styletext-loader with the css-loader
Then add the loader to your webpack config. For example:
style.css
`css
body {
background: green;
}
`
component.js
`js
import { cssText, styles} from './style.css';
`
webpack.config.js
`js
module.exports = {
module: {
rules: [
{
test: /\.css$/i,
use: ['styletext-loader', 'css-loader'],
},
],
},
};
`
Options
| Name | Type | Default | Description |
| :--------------: | :------------------: | :--------: | :------------------------------------------------------- |
| esModule | {Boolean} | false | Use ES modules syntax |
$3
Type: Boolean
Default: false
By default, styletext-loader generates JS modules that use the CommonJS modules syntax.
There are some cases in which using ES modules is beneficial, like in the case of module concatenation and tree shaking.
You can enable a ES module syntax using:
webpack.config.js
`js
module.exports = {
module: {
rules: [
{
test: /\.css$/i,
use: [
{
loader: 'styletext-loader',
options: { esModule: true },
},
{
loader: 'css-loader',
options: { modules: false,esModule:true }
},
]
},
],
},
};
``