Webpack loaders
执行相反的多少操作(从右到左的字符串时,基层当数组),最后加载器返回的Javascript。
一旦过去,接下来的实现细节处理写查询参数配置每个加载程序,显得很笨拙。
写在一行的查询字符串
module.exports = {
module: {
loaders: [
{
test: /\.scss$/,
loader: 'style!css!autoprefixer?browsers=last 2 version!sass?outputStyle=expanded',
},
],
},
}
查询字符串数组
module.exports = {
module: {
loaders: [
{
test: /\.scss$/,
loaders: [
'style',
'css',
'autoprefixer?browsers=last 2 version',
'sass?outputStyle=expanded',
],
},
],
},
}
细化的查询字符串数组:
module.exports = {
module: {
loaders: [
{
test: /\.scss$/,
loader: 'style',
},
{
test: /\.scss$/,
loader: 'css',
},
{
test: /\.scss$/,
loader: 'autoprefixer',
query: { browsers: 'last 2 version' },
},
{
test: /\.scss$/,
loader: 'sass',
query: { outputStyle: 'expanded' },
},
],
},
}
就我个人而言,我更喜欢最后的版本,因为它更容易构成一连串的压缩器和加载器配置复杂的查询。