【报错问题】Vue element-ui 提示 ‘element-ui/lib/theme-chalk/index.css’ 找不到

一、版本说明，没有的需要安装

"element-ui": "^2.13.0",          // npm install --save element-ui
"vue": "^2.5.2",                  // npm install --save vue
"vue-router": "^3.0.1",           // npm install --save vue-router
"css-loader": "^0.28.11",         // npm install --save-dev css-loader
"file-loader": "^1.1.11",         // npm install --save-dev file-loader
"node-sass": "^4.11.0",           // npm install --save-dev node-sass
"sass-loader": "^7.1.0",          // npm install --save-dev sass-loader
"style-loader": "^1.0.1",         // npm install --save-dev style-loader
"url-loader": "^3.0.0"            // npm url-loader --save-dev url-loader

 

---

二、【报错原因】

2.1、安装 sass 时，报错 ‘ This dependency was not found: element-ui/lib/theme-chalk/index.css’ 

 

2.2、以为element-ui 引用方式改变，参考官网，引入方式和它一样哎，我迷惑了    

 

---

三、【解决方法】

3.1、安装第一步需要的插件：

1. 主要是 `css-loader`、 `file-loader`、 `url-loader`  的版本，
2. 然后需要安装   `node-sass`、  `sass-loader`、  `style-loader`

 

3.2、修改本地文件

【 \build\webpack.base.conf.js 】文件， 修改modules.rules属性下添加以下代码

      {
        test: /\.scss$/,
        loaders: ['style', 'css', 'sass']
      }, 
      { 
        test: /\.(eot|woff|ttf)$/,
        loader: 'file-loader'
      }

 

 

 

3.3、如果安装之后不成功

1. 删除 「node_modules」目录 和 「package-lock.json」文件，重新安装 npm install 或 npm i 或 cnpm install 或 cnpm i
2. 不行，就重复第一步，我可能重复了三次，后来终于好了

 

 

3.4、如果需要用编辑器 Visual Studio Code 本地调试 Debugger 项目，需要修改以下文件

【 \config\index.js 】文件，修改 dev 属性下的 devtool 和 cacheBusting 属性

devtool: 'source-map',
cacheBusting: false,

属性说明：

• devtool: 'source-map' ： 能够查看哪里报错 并 找到报错的源文件
• cacheBusting: false：指的缓存破坏，特别是进行sourceMap debug时，需要设置成false

 

 

 

写给自己的随笔，有问题欢迎指出ψ(*｀ー´)ψ