照着编码，会报这个错误，怎么解决呢？

个回答

灿灿大王

2022-08-02 16:56:46

rules中增加以下规则：
{
test: /\.css$/,
use: ['style-loader', 'css-loader']
},//配置处理.css文件的第三方处理规则
然后去github里对应webpack版本下载安装对应的css-loader、style-loader版本依赖
我的依赖版本如下，可以作为参考：
"css-loader": "^6.7.1",
"style-loader": "^3.1.0",
"vue": "^2.6.10",
"vue-loader": "^15.7.0",
"vue-template-compiler": "^2.6.10",
"webpack": "^5.73.0"

0

dadajiao: 2021-04-07 10:44:36

const path = require('path')const VueLoaderPlugin = require('vue-loader/lib/plugin')const htmlWebpackplugin = require('html-webpack-plugin');module.exports = {entry: path.join(__dirname, 'src/index.js'),output: {filename: 'bundle.js',path: path.join(__dirname, "dist")},module: {rules: [// {//     test: /\.(vue|js|jsx)$/,//     loader: 'eslint-loader',//     exclude: /node_modules/,//     enforce: 'pre'// },{test: /\.vue$/,loader: 'vue-loader'},{test: /\.css$/,loader: 'css-loader'},{test: /\.styl/,use: ['style-loader','css-loader','stylus-loader']}]},plugins: [new htmlWebpackplugin({}),new VueLoaderPlugin()],mode: 'development'}

yyii

2021-04-02 15:05:25

谢谢楼主！照你的方法生成dist了。

0
慕粉3815882

2021-03-19 11:32:18

这个我解决了，webpack版本过高的话需要安装html-webpack-plugin和vue-loader-plugin插件,然后webpack.config.js的配置如下：
const path = require('path')
const VueLoaderPlugin = require('vue-loader/lib/plugin')
const htmlWebpackplugin = require('html-webpack-plugin');
module.exports = {
entry:path.join(__dirname,'src/index.js'),
output:{
filename:'bundle.js',
path:path.join(__dirname,'dist')
},
module:{
rules:[
{
test:/\.vue$/,
loader:'vue-loader'
},
{
test: /\.css$/,
loader: 'css-loader'
},
{
test:/\.styl/,
use:[
'style-loader',
'css-loader',
'stylus-loader'
]
},
{
test:/\.(gif|jpg|jpeg|png|svg)$/,
use:[
{
loader:'url-loader',
options:{
limit:1024,
name:'[name]-aaa.[ext ]'
}
}

]
}
]
},
plugins: [
new htmlWebpackplugin({
}),
new VueLoaderPlugin()
],
}

5
慕粉3815882

2021-03-16 00:33:40

我也是这个问题

0