How to use css-loader - 5 common examples
To help you get started, we’ve selected a few css-loader examples, based on popular ways it is used in public projects.
Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
react-static / react-static / packages / react-static-plugin-stylus / src / node.api.js View on Github 
ExtractCssChunks.loader,
cssLoader,
postCssLoader,
stylusLoader,
]
} else if (stage === 'node') {
// Node
// Don't extract css to file during node build process
loaders = [cssLoader, postCssLoader, stylusLoader]
} else {
// Prod
// for legacy css-loader version (<2.0) we need to add "minimize" to minify css code
// for >2.0 it is handled with https://github.com/NMFR/optimize-css-assets-webpack-plugin
const cssLoaderVersion = require('css-loader/package.json').version
if (semver.satisfies(cssLoaderVersion, '<2') === true) {
cssLoader.options.minimize = true
}
loaders = [
ExtractCssChunks.loader,
cssLoader,
postCssLoader,
stylusLoader,
]
}
config.module.rules[0].oneOf.unshift({
test: /\.styl$/,
use: loaders,
})},
cssLoader,
postCssLoader,
sassLoader,
]
} else if (stage === 'node') {
// Node
// Don't extract css to file during node build process
loaders = [cssLoader, postCssLoader, sassLoader]
} else {
// Prod
// for legacy css-loader version (<2.0) we need to add "minimize" to minify css code
// for >2.0 it is handled with https://github.com/NMFR/optimize-css-assets-webpack-plugin
const cssLoaderVersion = require('css-loader/package.json').version
if (semver.satisfies(cssLoaderVersion, '<2') === true) {
cssLoader.options.minimize = true
}
loaders = [ExtractCssChunks.loader, cssLoader, postCssLoader, sassLoader]
}
config.module.rules[0].oneOf.unshift({
test: /\.s(a|c)ss$/,
use: loaders,
})
if (
config.optimization.splitChunks &&
config.optimization.splitChunks &&
config.optimization.splitChunks.cacheGroups.styles
) {},
cssLoader,
postCssLoader,
lessLoader,
]
} else if (stage === 'node') {
// Node
// Don't extract css to file during node build process
loaders = [cssLoader, postCssLoader, lessLoader]
} else {
// Prod
// for legacy css-loader version (<2.0) we need to add "minimize" to minify css code
// for >2.0 it is handled with https://github.com/NMFR/optimize-css-assets-webpack-plugin
const cssLoaderVersion = require('css-loader/package.json').version
if (semver.satisfies(cssLoaderVersion, '<2') === true) {
cssLoader.options.minimize = true
}
loaders = [ExtractCssChunks.loader, cssLoader, postCssLoader, lessLoader]
}
config.module.rules[0].oneOf.unshift({
test: /\.less$/,
use: loaders,
})
return config
},
})postcss(this, css, map, meta, (err, ...args) => {
if (err) {
done(err);
return;
}
const ctx = { ...this };
ctx.query = {
...this.query,
modules: this.query.modules || true,
importLoaders: 0,
};
cssLoader.call(ctx, ...args);
});
};const path = require('path');
const CreateFileWebpack = require('create-file-webpack');
const CopyWebpackPlugin = require('copy-webpack-plugin');
const ExtractTextPlugin = require('extract-text-webpack-plugin');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
const fs = require('fs');
const babelPluginComponentStaticInfo = require('@remax/babel-plugin-remax-static-info');
const ejs = require('ejs');
const thisNodeMoudles = name => require.resolve(name);
const getLocalIdent = require('css-loader/dist/utils.js').getLocalIdent;
const cssLoader = thisNodeMoudles('css-loader');
const babelLoader = thisNodeMoudles('babel-loader');
const lessLoader = thisNodeMoudles('less-loader');
const babelPresetEnv = thisNodeMoudles('@babel/preset-env');
const babelPresetReact = thisNodeMoudles('@babel/preset-react');
const babelPluginComponentStaticInfoPath = thisNodeMoudles('@remax/babel-plugin-remax-static-info');
const readJSON = file => JSON.parse(fs.readFileSync(file, 'utf-8'));
function GeneraeBaseWxmlWebpackPlugin() {
const apply = (compiler) => {
const emit = (compilation, cb) => {
const {
components,
