Vue取消eslint语法限制

Posted 2020-12-06 pandaly

由于vue对语法的限制过于严格，以至于在我第一次编译运行的时候一直编译失败，当然也包括一些警告

? myproject npm run dev 

> testapp@1.0.0 dev /Users/test/myproject
> webpack-dev-server --inline --progress --config build/webpack.dev.conf.js

95% emitting 

WARNING Compiled with 1 warnings 5:00:12 PM


? http://eslint.org/docs/rules/indent Expected indentation of 0 spaces but found 2 
src/components/Message.vue:46:1
export default {
^

? http://eslint.org/docs/rules/indent Expected indentation of 2 spaces but found 4 
src/components/Message.vue:47:1
data() {
^


? http://eslint.org/docs/rules/indent Expected indentation of 2 spaces but found 4 
src/components/Message.vue:65:1
}
^

? http://eslint.org/docs/rules/indent Expected indentation of 0 spaces but found 2 
src/components/Message.vue:66:1
}
^


? 23 problems (23 errors, 0 warnings)


Errors:
21 http://eslint.org/docs/rules/indent
2 http://eslint.org/docs/rules/space-before-function-paren

You may use special comments to disable some warnings.
Use // eslint-disable-next-line to ignore the next line.
Use /* eslint-disable */ to ignore all warnings in a file.

 

这里出现警告和错误的原因是eslint是一个语法检查工具，但是限制很严格，vue文件里面很多空格都会导致红线警告，解决方法就是关闭语法限制。

在build/webpack.base.conf.js文件中，注释或者删除掉：module->rules中有关eslint的规则

module: {
  rules: [
    //...(config.dev.useEslint ? [createLintingRule()] : []), // 注释或者删除
    {
      test: /.vue$/,
      loader: ‘vue-loader‘,
      options: vueLoaderConfig
    },
    ...
    }
  ]
}

重新运行一下npm run dev或者构建命令 npm run build就可以了