vue文件单独打包css

单独打包需要使用extract-text-webpack-plugin插件;

我用的extract-text-webpack-plugin@2.1.2这个版本,webpack用的webpack2

配置如下:

1.先定义      const ExtractTextPlugin = require('extract-text-webpack-plugin');

2.配置css和less

{
test: /.css$/,
use: ExtractTextPlugin.extract({
fallback:'style-loader',
use:'css-loader'
})
},
{
test: /.less$/,
use: ExtractTextPlugin.extract({
fallbackLoader: 'style-loader',
use:[{
loader: 'css-loader',
options: { sourceMap: true, importLoaders: 1 }
},{
loader: 'less-loader',
options: { sourceMap: true }
}]

})

},

3.添加plugins

new ExtractTextPlugin('css/styles.css')

4.记得修改devtool: 'source-map'

5.查看是什么模式,开发模式还是生产模式,生产模式才会打包











 
原文地址:https://www.cnblogs.com/liuhuanwen/p/7412872.html