我正在尝试使用extract-text-webpack-plugin生成捆绑的css文件并按顺序生成。
现在,CSS文件已生成,但“ignoreOrder”似乎无效,内容的顺序不遵守源代码的顺序。
//webpack.config.js
const path = require('path');
const webpack = require('webpack');
const ExtractTextPlugin = require('extract-text-webpack-plugin');
const ExtractSCSS = new ExtractTextPlugin({
filename: function(getPath) {
return getPath('css/[name].css');
},
allChunks: false
});
module.exports = {
entry: {
'index': './index.js',
// ......
},
output: {
filename: '[name].bundle.js',
path: path.resolve(__dirname, ((env = 'develop') => {
let assignRoot = {
'develop': './develop/bundle/'
// ......
};
return assignRoot[env];
})(process.env.NODE_ENV))
},
module: {
rules: [
{
test: /\.js$/,
exclude: /(node_modules|bower_components)/,
use: [{
loader: 'imports-loader?this=>window,jQuery=>this.jQuery'
}, {
loader: 'babel-loader',
options: {
presets: ['env']
}
}
},
{
test: /\.css$|\.scss$/,
use: ExtractSCSS.extract({
use: [
{
loader: 'css-loader',
options: {
minimize: true
}
},
{ loader: 'sass-loader' },
{
loader: 'preprocess-loader',
options: {
THEME: 'uplantravel'
}
}
],
})
}]
},
plugins: ExtractSCSS
};
我的js导入了一些scss和js。
//index.js
import './@magaele/a.scss';
import './@magaele/b.scss';
import './@magaele/c/css.scss';
//......
import './@magaele/a/module.js';
import './@magaele/b/module.js';
import './@magaele/c/module.js';
//......