在某些Webpack示例中,您会看到对"规则"的引用。阵列:
module.exports = {
module: {
rules: [
{
test: /\.scss$/,
use: ExtractTextPlugin.extract({
fallback: 'style-loader',
//resolve-url-loader may be chained before sass-loader if necessary
use: ['css-loader', 'sass-loader']
})
}
]
},
plugins: [
new ExtractTextPlugin('style.css')
//if you want to pass in options, you can do so:
//new ExtractTextPlugin({
// filename: 'style.css'
//})
]
}
(https://github.com/webpack-contrib/extract-text-webpack-plugin)
另外,还有一个加载器数组:
var ExtractTextPlugin = require("extract-text-webpack-plugin");
module.exports = {
module: {
loaders: [
{
test: /\.css$/,
loader: ExtractTextPlugin.extract({
loader: "css-loader"
})
},
{ test: /\.png$/, loader: "file-loader" }
]
},
plugins: [
new ExtractTextPlugin({
filename: "style.css",
allChunks: true
})
]
};
(https://github.com/webpack/webpack/tree/master/examples/css-bundle)
有什么区别?哪个应该用?
答案 0 :(得分:81)
在Webpack 1中使用加载器,在Webpack 2中使用规则。他们说"加载器"在将来,它将被弃用,以支持module.rules。
请参阅官方网站上的Migrating Versions。
module.loaders现在是module.rules
旧的加载程序配置被更强大的规则所取代 系统,允许配置加载器等。对于 兼容性原因,旧的module.loaders语法仍然有效 并解析旧名称。新的命名约定更容易 了解并且是将配置升级到使用的一个很好的理由 module.rules。