A clean-css loader for webpack.
yarn add -D clean-css-loaderUse the loader either via your webpack config, CLI or inline.
webpack.config.js
const production = false;
const cssUseList = ["style-loader", "css-loader"];
if (production) {
cssUseList.push("clean-css-loader");
// or with options
cssUseList.push({
loader: "clean-css-loader",
options: {
compatibility: "ie9",
level: 2,
inline: ["remote"]
}
});
}
module.exports = {
module: {
rules: [
{
test: /\.css$/,
use: cssUseList
}
]
}
};In your application
import cssMin from "style.css";webpack --module-bind 'css=style-loader!css-loader!clean-css-loader'In your application
import cssMin from "style.css";In your application
import cssMin from "style-loader!css-loader!clean-css-loader!./style.css";This option disable output warnings
More option: https://github.com/jakubpawlowicz/clean-css#constructor-options
Example config (for webpack 1.x):
module.exports = {
module: {
loaders: [
{
test: /\.css$/,
loader: "css!clean-css"
},
{
test: /\.styl$/,
loader: "css!clean-css!stylus?reslve url"
}
//...
],
// Example Set options (Key "clean-css" or cleancss or CleanCSS):
"clean-css": {
debug: true,
mediaMerging: true
}
}
};