错误内容
ERROR in ./src/lib/vue-toast.vue?vue&type=style&index=0&lang=scss& (./node_modules/[email protected]@vue-loader/lib??vue-loader-options!./src/lib/vue-toast.vue?vue&type=style&index=0&lang=scss&) 9:0
Module parse failed: Unexpected token (9:0)
File was processed with these loaders:
* ./node_modules/[email protected]@vue-loader/lib/index.js
You may need an additional loader to handle the result of these loaders.
|
|
> .toast-container{
| position: absolute;
| left:0;
@ ./src/lib/vue-toast.vue?vue&type=style&index=0&lang=scss& 1:0-152 1:168-171 1:173-322 1:173-322
@ ./src/lib/vue-toast.vue
@ ./src/lib/index.js
错误截图
解决办法:添加如下这个json,解决如上的报错问题
{
test: /\.scss$/,
use: ['css-loader', 'sass-loader']
},
所涉及相关文件如下(若解决了,可不往下看)
vue-toast.vue文件如下
webpack.config.js文件配置如下
var path = require('path');
const VueLoaderPlugin = require('vue-loader/lib/plugin');
module.exports = {
entry:'./src/lib/index.js',
output:{
path:path.join(__dirname,'./dist'),
filename:'webpackLearn.js'
},
module:{
rules: [
{
test:/\.vue$/,
loader: 'vue-loader',
},
{// 添加这个json,解决如上的报错问题
test: /\.scss$/,
use: ['style-loader','css-loader', 'sass-loader']
},
]
},
plugins: [
new VueLoaderPlugin()
]
}
package.json文件
{
"name": "webpacklearn",
"version": "1.0.0",
"description": "Making plug-ins by CoderZB",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"keywords": [
"plug-ins"
],
"author": "CoderZB",
"license": "ISC",
"dependencies": {
"babel-core": "^6.26.3",
"babel-preset-env": "^1.7.0",
"clone-deep": "^4.0.1",
"consolidate": "^0.15.1",
"css-loader": "^3.2.0",
"merge-source-map": "^1.1.0",
"node-sass": "^4.12.0",
"prettier": "^1.18.2",
"sass-loader": "^8.0.0",
"scss": "^0.2.4",
"scss-loader": "^0.0.1",
"style-loader": "^1.0.0",
"vue-loader": "^15.7.1",
"vue-template-compiler": "^2.6.10",
"vue-template-es2015-compiler": "^1.9.1",
"webpack": "^4.40.0"
}
}