博客

使用低版本的vue-loader遇到的坑

最近在学习使用webpack打包vue项目，所以一开始下载了vue-loader和vue-template-compiler，但是由于现在15版本的vue-loader需要引入一个插件才能使用，我为了省事，在下载的时候指定了vue-loader的版本是14.2.2，一开始打包什么的都没问题，但是后来加入了style-loader和postcss-loader以及其他的杂七杂八的loader和plugin之后，我使用webpack打包就老是报错，（使用webpack-dev-server就不会，真是门玄学），报错的信息如下：

ERROR in ./src/app.vue (./node_modules/css-loader/dist/cjs.js?minimize!./node_modules/vue-loader/lib/style-compiler?{“optionsId”:“0”,“vue”:true,“id”:“data-v-bdfc2148”,“scoped”:true,“sourceMap”:false}!./node_modules/stylus-loader!./node_modules/vue-loader/lib/selector.js?type=styles&index=0!./src/app.vue)

Module build failed (from ./node_modules/css-loader/dist/cjs.js):


ValidationError: Invalid options object. CSS Loader has been initialized using an options object that does not match the API schema.

• options has an unknown property ‘minimize’. These properties are valid:
  
  object { url?, import?, modules?, sourceMap?, importLoaders?, localsConvention?, onlyLocals?, esModule? }
  
  at validate (D:\weblearning\front\project\vue\app3\node_modules\schema-utils\dist\validate.js:96:11)
  
  at Object.loader (D:\weblearning\front\project\vue\app3\node_modules\css-loader\dist\index.js:36:28)
  
  @ ./src/app.vue (./node_modules/vue-style-loader!./node_modules/css-loader/dist/cjs.js?minimize!./node_modules/vue-loader/lib/style-compiler?{“optionsId”:“0”,“vue”:true,“id”:“data-v-bdfc2148”,“scoped”:true,“sourceMap”:false}!./node_modules/stylus-loader!./node_modules/vue-loader/lib/selector.js?type=styles&index=0!./src/app.vue) 4:14-339
  
  @ ./src/app.vue
  
  @ ./src/index.js
  
  我查了好久的百度都没找到，后来在报错信息中看到了vue-loader，然后想到我的vue-loader是低版本的，于是就卸载了，然后重新安装了新版本的再配置一个插件后使用webpack打包就可以了

卸载：

npm uninstall vue-loader

重新安装：

npm i vue-loader

引入插件：

在plugins中实例化：



最后npm run build使用webpack打包就成功啦：