我正在使用带有Webpack 2.2.1的extract-text-webpack-plugin 2.0.0-rc.3，并且在运行构建时出现此错误：
json这是我的webpack.config.js：
/node_modules/extract-text-webpack-plugin/index.js:259
var shouldExtract = !!(options.allChunks || chunk.isInitial());
^
TypeError: chunk.isInitial is not a function
当我从'use strict';
const argv = require('yargs').argv;
const ExtractTextPlugin = require("extract-text-webpack-plugin");
const webpack = require('webpack');
module.exports = (function () {
let config = {
entry : './' + process.env.npm_package_config_paths_source + '/main.js',
output : {
filename : 'main.js'
},
watch : !!argv.watch,
vue : {
loaders : {
js : 'babel-loader',
// Create separate CSS file to prevent unstyled content
sass : ExtractTextPlugin.extract("css!sass?sourceMap") // requires `devtool: "#source-map"`
}
},
module : {
rules : [
{
test : /\.js$/,
use : 'babel-loader',
exclude : '/node_modules/'
},
{
test : /\.vue$/,
use : 'vue-loader',
options : {
loaders : {
'scss' : 'vue-style-loader!css-loader!sass-loader',
'sass' : 'vue-style-loader!css-loader!sass-loader?indentedSyntax'
},
}
}
]
},
plugins : [
new webpack.DefinePlugin({
'process.env' : {
npm_package_config_paths_source : '"' + process.env.npm_package_config_paths_source + '"'
}
}),
new ExtractTextPlugin("style.css")
],
resolve : {
alias : {
'vue$' : 'vue/dist/vue.common.js'
}
},
babel : {
"presets" : ["es2015", "stage-2"],
"comments" : false,
"env" : {
"test" : {
"plugins" : ["istanbul"]
}
}
},
devtool : "#source-map" // #eval-source-map is faster but not compatible with ExtractTextPlugin
};
if (process.env.NODE_ENV === 'production') {
config.plugins = [
// short-circuits all Vue.js warning code
new webpack.DefinePlugin({
'process.env' : {
NODE_ENV : '"production"',
npm_package_config_paths_source : '"' + process.env.npm_package_config_paths_source + '"'
}
}),
// minify with dead-code elimination
new webpack.optimize.UglifyJsPlugin(),
new ExtractTextPlugin("style.css")
];
config.devtool = "#source-map";
}
return config;
})();
数组中删除new ExtractTextPlugin("style.css")时，构建运行正常，但不会创建plugins。
如果我添加style.css选项，则错误会变为：
allChunks: true答案 0 :(得分：0)
如果您在.vue文件或seprate .scss文件中编写样式规则，使用以下webpack配置可以实现您正在搜索的内容：
<强> webpack.confi.js：
var webpack = require('webpack');
var ExtractTextPlugin = require('extract-text-webpack-plugin');
....
....
module.exports = {
....
....
module: {
rules: [
{
test: /\.vue$/,
loader: 'vue-loader',
options: {
loaders: {
'scss': ExtractTextPlugin.extract('css-loader!sass-loader'),
'sass': ExtractTextPlugin.extract('css-loader!sass-loader?indentedSyntax')
}
}
},
....
....
{
test: /\.scss$/,
loader: ExtractTextPlugin.extract('css-loader!sass-loader')
}
....
....
] // rules end
}, // module end
plugins: [
new ExtractTextPlugin('style.css')
],
....
}
请确保您已通过NPM安装了这些模块/装载程序：