详解Vue取消eslint语法限制


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





➜ my-project npm run dev 

 

> bblee-app@1.0.0 dev /Users/bianlifeng/my-project

> 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/space-before-function-paren Missing space before function parentheses   

 src/components/Message.vue:47:9

   data() {

      ^

 

 ✘ http://eslint.org/docs/rules/indent            Expected indentation of 4 spaces but found 6  

 src/components/Message.vue:48:1

    return {

  ^

 

 ✘ http://eslint.org/docs/rules/indent            Expected indentation of 6 spaces but found 8  

 src/components/Message.vue:49:1

     form: {

  ^

 

 ✘ http://eslint.org/docs/rules/indent            Expected indentation of 8 spaces but found 10 

 src/components/Message.vue:50:1

      name: '',

  ^

 

 ✘ http://eslint.org/docs/rules/indent            Expected indentation of 8 spaces but found 10 

 src/components/Message.vue:51:1

      region: '',

  ^

 

 ✘ http://eslint.org/docs/rules/indent            Expected indentation of 8 spaces but found 10 

 src/components/Message.vue:52:1

      date1: '',

  ^

 

 ✘ http://eslint.org/docs/rules/indent            Expected indentation of 8 spaces but found 10 

 src/components/Message.vue:53:1

      date2: '',

  ^

 

 ✘ http://eslint.org/docs/rules/indent            Expected indentation of 8 spaces but found 10 

 src/components/Message.vue:54:1

      delivery: false,

  ^

 

 ✘ http://eslint.org/docs/rules/indent            Expected indentation of 8 spaces but found 10 

 src/components/Message.vue:55:1

      type: [],

  ^

 

 ✘ http://eslint.org/docs/rules/indent            Expected indentation of 8 spaces but found 10 

 src/components/Message.vue:56:1

      resource: '',

  ^

 

 ✘ http://eslint.org/docs/rules/indent            Expected indentation of 8 spaces but found 10 

 src/components/Message.vue:57:1

      desc: ''

  ^

 

 ✘ http://eslint.org/docs/rules/indent            Expected indentation of 6 spaces but found 8  

 src/components/Message.vue:58:1

     }

  ^

 

 ✘ http://eslint.org/docs/rules/indent            Expected indentation of 4 spaces but found 6  

 src/components/Message.vue:59:1

    }

  ^

 

 ✘ http://eslint.org/docs/rules/indent            Expected indentation of 2 spaces but found 4  

 src/components/Message.vue:60:1

   },

  ^

 

 ✘ http://eslint.org/docs/rules/indent            Expected indentation of 2 spaces but found 4  

 src/components/Message.vue:61:1

   methods: {

  ^

 

 ✘ http://eslint.org/docs/rules/indent            Expected indentation of 4 spaces but found 6  

 src/components/Message.vue:62:1

    onSubmit() {

  ^

 

 ✘ http://eslint.org/docs/rules/space-before-function-paren Missing space before function parentheses   

 src/components/Message.vue:62:15

    onSubmit() {

         ^

 

 ✘ http://eslint.org/docs/rules/indent            Expected indentation of 6 spaces but found 8  

 src/components/Message.vue:63:1

     console.log('submit!');

  ^

 

 ✘ http://eslint.org/docs/rules/indent            Expected indentation of 4 spaces but found 6  

 src/components/Message.vue:64:1

    }

  ^

 

 ✘ 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就可以啦。