webpack的exract-text-webpack-plugin插件的疑问
//webpack.config.js
const extractCSS = new ExtractTextPlugin('[name]-one.css');
module: {
rules: [
{
test: /\.css$/,
use: extractCSS.extract([ 'css-loader', 'postcss-loader' ]) //疑问
}
]
},
plugins: [
extractCSS
]
刚学习webpack,请问注释行的代码是什么意思,查了官方文档没看明白。
官方实例:
Multiple Instances There is also an extract function on the instance.
You should use this if you have more than one instance of ExtractTextPlugin.
const ExtractTextPlugin = require('extract-text-webpack-plugin');
// Create multiple instances
const extractCSS = new ExtractTextPlugin('stylesheets/[name]-one.css');
module.exports = {
module: {
rules: [
{
test: /\.css$/,
use: extractCSS.extract([ 'css-loader', 'postcss-loader' ])
}
]
},
plugins: [
extractCSS
]
};
这是官方对extract方法的参数说明:
extract
ExtractTextPlugin.extract(options: loader | object)
Creates an extracting loader from an existing loader. Supports loaders of type { loader: [name]-loader -> {String}, options: {} -> {Object} }.
- options.use
Loader(s) that should be used for converting the resource to a CSS exporting module (required) - options.fallback
loader(e.g 'style-loader') that should be used when the CSS is not extracted (i.e. in an additional chunk when allChunks: false) - options.publicPath
Override the publicPath setting for this loader
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
你这是webpack1.x吧?
首先webpack在页面中引用某css比如require("a.css"); 如果没有配置项的话是css in js形式,
如果配置了style-loader是可以把css文件提取到style标签里边然后添加到head标签内的,如果在此之上配置了ExtractTextPlugin插件,就可以把这样式提取到文件中,不知道LZ了解了吗,毕竟单纯的理论有些晦涩(less sass等同理,只是多了一些配置)?