用vue手脚架生成的项目直接修改时.vue文件后，保存编译就报一大堆的错，这是咋回事呢？

Question

app.vue代码如下：

<template>
    <div id="app">
         <h1 v-text="title"></h1>
         <input v-model="newItem" @keyup.enter="addNew" />
         <ul>
             <li v-for="item in items" v-bind:class="{finished:item.isFinished}" v-on:click="toggleFinish(item)">
                 {{ item.label }}
             </li>
         </ul>
    </div>
</template>

<script>
export default {
  data () {
    return {
      title: 'vue to do list',
      items: [{
      label: 'aaa',
      isFinished: true
      },
       {
      label: 'bbb',
      isFinished: false
      }
      ],
      newItem: ''
    }
  },
  methods: {
                 toggleFinish: function(item){
          item.isFinished=!item.isFinished
      },
      addNew: function(){
          console.log(this.newItem); }
  }
}
</script>
<style>
.finished{
    color:#eee;
}
</style>

报错：

client.js?7955:105 [HMR] bundle has errors:
client.js?7955:107 [HMR] ./src/App.vue
  ✘  http://eslint.org/docs/rules/indent                       Expected indentation of 8 space characters but found 6                                                         
 /Users/apple/Desktop/VUEJS/vuePro/myvueProject01/src/App.vue:19:7
        label: 'aaa',
         ^
  ✘  http://eslint.org/docs/rules/indent                       Expected indentation of 8 space characters but found 6                                                         
/Users/apple/Desktop/VUEJS/vuePro/myvueProject01/src/App.vue:20:7
        isFinished: true
         ^
  ✘  http://eslint.org/docs/rules/indent                       Expected indentation of 6 space characters but found 7                                                         
/Users/apple/Desktop/VUEJS/vuePro/myvueProject01/src/App.vue:22:8
         {
          ^

  ✘  http://eslint.org/docs/rules/indent                       Expected indentation of 8 space characters but found 6                                                         
  /Users/apple/Desktop/VUEJS/vuePro/myvueProject01/src/App.vue:23:7
        label: 'bbb',
         ^

  ✘  http://eslint.org/docs/rules/indent                       Expected indentation of 8 space characters but found 6                                                         
  /Users/apple/Desktop/VUEJS/vuePro/myvueProject01/src/App.vue:24:7
        isFinished: false
         ^

  ✘  http://eslint.org/docs/rules/no-mixed-spaces-and-tabs     Mixed spaces and tabs                                                                                          
  /Users/apple/Desktop/VUEJS/vuePro/myvueProject01/src/App.vue:31:2
                   toggleFinish: function(item){
       ^

  ✘  http://eslint.org/docs/rules/indent                       Expected indentation of 4 space characters but found 1                                                         
  /Users/apple/Desktop/VUEJS/vuePro/myvueProject01/src/App.vue:31:6
                   toggleFinish: function(item){
                    ^

  ✘  http://eslint.org/docs/rules/space-before-function-paren  Missing space before function parentheses                                                                      
  /Users/apple/Desktop/VUEJS/vuePro/myvueProject01/src/App.vue:31:28
                   toggleFinish: function(item){
                                          ^

  ✘  http://eslint.org/docs/rules/space-before-blocks          Missing space before opening brace                                                                             
  /Users/apple/Desktop/VUEJS/vuePro/myvueProject01/src/App.vue:31:34
                   toggleFinish: function(item){
                                                ^

  ✘  http://eslint.org/docs/rules/no-mixed-spaces-and-tabs     Mixed spaces and tabs                                                                                          
  /Users/apple/Desktop/VUEJS/vuePro/myvueProject01/src/App.vue:32:2
            item.isFinished=!item.isFinished
    ^

  ✘  http://eslint.org/docs/rules/indent                       Expected indentation of 3 space characters but found 2                                                         
  /Users/apple/Desktop/VUEJS/vuePro/myvueProject01/src/App.vue:32:5
            item.isFinished=!item.isFinished
             ^

  ✘  http://eslint.org/docs/rules/space-infix-ops              Infix operators must be spaced                                                                                 
  /Users/apple/Desktop/VUEJS/vuePro/myvueProject01/src/App.vue:32:20
            item.isFinished=!item.isFinished
                            ^

  ✘  http://eslint.org/docs/rules/no-mixed-spaces-and-tabs     Mixed spaces and tabs                                                                                          
  /Users/apple/Desktop/VUEJS/vuePro/myvueProject01/src/App.vue:33:2
        },
    ^

  ✘  http://eslint.org/docs/rules/indent                       Expected indentation of 1 space character but found 2                                                          
  /Users/apple/Desktop/VUEJS/vuePro/myvueProject01/src/App.vue:33:4
        },
         ^

  ✘  http://eslint.org/docs/rules/no-mixed-spaces-and-tabs     Mixed spaces and tabs                                                                                          
  /Users/apple/Desktop/VUEJS/vuePro/myvueProject01/src/App.vue:34:2
        addNew: function(){
    ^

  ✘  http://eslint.org/docs/rules/indent                       Expected indentation of 4 space characters but found 2                                                         
  /Users/apple/Desktop/VUEJS/vuePro/myvueProject01/src/App.vue:34:4
        addNew: function(){
         ^

  ✘  http://eslint.org/docs/rules/space-before-function-paren  Missing space before function parentheses                                                                      
  /Users/apple/Desktop/VUEJS/vuePro/myvueProject01/src/App.vue:34:20
        addNew: function(){
                         ^

  ✘  http://eslint.org/docs/rules/space-before-blocks          Missing space before opening brace                                                                             
  /Users/apple/Desktop/VUEJS/vuePro/myvueProject01/src/App.vue:34:22
        addNew: function(){
                           ^

  ✘  http://eslint.org/docs/rules/no-mixed-spaces-and-tabs     Mixed spaces and tabs                                                                                          
  /Users/apple/Desktop/VUEJS/vuePro/myvueProject01/src/App.vue:35:2
            console.log(this.newItem); }
    ^

  ✘  http://eslint.org/docs/rules/brace-style                  Closing curly brace should be on the same line as opening curly brace or on the line after the previous block  
  /Users/apple/Desktop/VUEJS/vuePro/myvueProject01/src/App.vue:35:5
            console.log(this.newItem); }
             ^

  ✘  http://eslint.org/docs/rules/indent                       Expected indentation of 4 space characters but found 2                                                         
  /Users/apple/Desktop/VUEJS/vuePro/myvueProject01/src/App.vue:35:5
            console.log(this.newItem); }
             ^

  ✘  http://eslint.org/docs/rules/semi                         Extra semicolon                                                                                                
  /Users/apple/Desktop/VUEJS/vuePro/myvueProject01/src/App.vue:35:30
            console.log(this.newItem); }
                                      ^


✘ 22 problems (22 errors, 0 warnings)


Errors:
  10  http://eslint.org/docs/rules/indent
   5  http://eslint.org/docs/rules/no-mixed-spaces-and-tabs
   2  http://eslint.org/docs/rules/space-before-blocks
   2  http://eslint.org/docs/rules/space-before-function-paren
   1  http://eslint.org/docs/rules/semi
   1  http://eslint.org/docs/rules/brace-style
   1  http://eslint.org/docs/rules/space-infix-ops

Answer 1

因为你设置了eslint，如果你不想有规范的js代码，可以重新初始化关掉eslint。
Use ESLint to lint your code? (Y/n) 这一步选no

如果你想有良好的规范，其实错误已经很清晰，大多数就是缩进不规范，分号不需要等原因，很容易解决的。写多了就成习惯了。

Answer 2

在bulid/webpack.base.conf.js里面有配置如下：
module: {
rules: [

...(config.dev.useEslint ? [createLintingRule()] : []),

点进config.dev.useEslint，发现在config/index.js里配置
useEslint: true, // 改为false即可。

Answer 3

在vue-cli 创建的时候选择了ESLint规范就会这样，
可以先写，在保存，启动终端运行 npm run lint 使用ESLint自动修复即可
就是有点麻烦~~~~