javascript - webpack的extract-text-webpack-plugin写法?
本文介绍了javascript - webpack的extract-text-webpack-plugin写法?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
问 题
loaders: [
{
test: /\.less$/,
loader: ExtractTextPlugin.extract({
loader: [
{
loader: 'css-loader',
query: {
modules: true
}
},
'less-loader'
]
})
}
]
报错
Cannot resolve module '[object Object]'
想使用query要怎么写?
直接写,知道是这样。
loader: ExtractTextPlugin.extract("style", "css?modules!less")
谢谢
写了个小demo
webpack.config.js
var path = require('path');
var ExtractTextPlugin = require('extract-text-webpack-plugin');
module.exports = {
devtool: 'source-map',
entry: {
entry: path.join(__dirname, 'a.js'),
},
output: {
filename: 'b.js',
},
module:{
loaders: [
{
test: /\.css$/,
// 下面是行的,下下面是不行的
// loader: ExtractTextPlugin.extract('css?modules'),
loader: ExtractTextPlugin.extract({
fallbackLoader: "style-loader",
loader: {
loader: "css-loader",
query: {
sourceMap: true
}
}
})
}
]
},
plugins: [
new ExtractTextPlugin('[name].css'),
],
}
a.js
require('./a.css');
console.log('a');
a.css
.test {
background: red;
}
.test .a {
color: red;
}
解决方案
你缺一个fallbackLoader,给你举个例子
loaders: [{
test: /\.css$/,
loader: ExtractTextPlugin.extract({
fallbackLoader: "style-loader",
loader: {
loader: "css-loader",
query: {
sourceMap: true
}
}
})
}]
https://github.com/webpack/ex...
这篇关于javascript - webpack的extract-text-webpack-plugin写法?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文