extract-text-webpack-plugin打包.vue文件中的styl部分生成一个css是文件失败
这是webpack.config.js
const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const CleanWebpackPlugin = require('clean-webpack-plugin');
const UglifyJSPlugin = require('uglifyjs-webpack-plugin');
const ExtractTextPlugin = require("extract-text-webpack-plugin")
const webpack = require('webpack');
module.exports = {
entry: {
coco: './src/main.js'
},
devtool: 'inline-source-map',
output: {
filename: '[hash].js',
path: path.resolve(__dirname, 'dist'),
publicPath: '/'
},
devServer: {
contentBase: './dist',
hot: true
},
module: {
rules: [{
test: /\.(png|svg|jpg|gif|woff|woff2|eot|ttf|otf)$/,
use: ['file-loader']
},
{
test: /\.vue$/,
exclude: /node_modules/,
use: [{
loader: 'vue-loader',
options: {
loaders: {
use: ExtractTextPlugin.extract({
fallback: 'style-loader',
use: ['css-loader', 'stylus-loader']
})
}
}
}]
}, {
test: /\.(css|styl)$/,
use: ExtractTextPlugin.extract({
fallback: 'style-loader',
use: ['css-loader', 'stylus-loader']
})
},
// {
// enforce: "pre",
// test: /\.js$/,
// exclude: /node_modules/,
// loader: "eslint-loader",
// options: {
// }
// },
{
test: /\.js$/,
exclude: /(node_modules|bower_components)/,
use: {
loader: 'babel-loader',
options: {
presets: ['env']
}
}
}
]
},
plugins: [
new UglifyJSPlugin(),
new CleanWebpackPlugin(['dist']),
new HtmlWebpackPlugin({
title: 'coding',
template: path.resolve(__dirname, './index.html'),
// filename: 'coco.html',
favicon: './src/images/OEM/coco.ico',
hash: true,
cache: true,
showErrors: true
}),
new ExtractTextPlugin({
filename: 'styles.css',
allChunks: true,
}),
new webpack.NamedModulesPlugin(),
new webpack.HotModuleReplacementPlugin()
],
resolve: {
extensions: ['.js', '.vue', '.json'],
alias: {
'vue': 'vue/dist/vue.js'
}
}
};
大神帮忙看一眼有哪里不对吗(build和run都没有报错.)
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论