用vue手脚架生成项目后，修改.Vue文件后，直接保存编译报一大堆错误，解决办法如下：

显示错误截图如下：

因为直接用vue脚手架初始化创建项目，会选择是否选用eslint语法检查，选择了之后，修改.vue文件报以上截图错误

解决办法如下：

1. 直接重新初始化关掉eslint语法，但是这样子做的话，有点麻烦。
2. 直接在文件根目录下的

   .eslintrc.j

   s文件加入如下代码，直接忽略掉就行了

   rules: {
   // allow async-await
   'generator-star-spacing': 'off',
   // allow debugger during development
   'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off',
   'no-trailing-spaces': 'off',
   'indent': 'off',
   'spaced-comment': 'off',
   'no-trailing-spaces': 'off',
   'no-new': 'off',
   'key-spacing': 'off',
   'comma-dangle': 'off',
   'eol-last': 'off',
   'quotes': 'off',
   'semi': 'off',
   'keyword-spacing': 'off',
   'space-before-blocks': 'off',
   'comma-spacing': 'off',
   'space-before-function-paren': 'off',
   'space-infix-ops': 'off',
   'no-multiple-empty-lines': 'off',
   'block-spacing': 'off',
   'padded-blocks': 'off',
   'arrow-spacing': 'off',
   'no-sequences': 'off',
   'no-unused-expressions': 'off',
   'no-multi-spaces': 'off',
   'no-unused-vars': 'off',
   'camelcase ': 'off',
   }
              

具体截图如下：

关于开发Vue项目格式化问题配置

大家用VSCode开发vue项目格式化的时候总是有一些行尾加；，空格等问题，其实下载插件直接解决就OK了，给你一个清爽的代码体验，具体步骤如下：

1. 下载插件vetur（开发vue必备）、prettier（代码洁癖必备）、beautify
2. Ctrl+Shift+p 找到用户设置 -----> setting.json中设置
3. 直接把下面的json格式代码复制即可

{
 "files.autoSave": "off",
  //是让vue后缀的文件就当作vue文件格式来解析
  "files.associations": {
    "*.vue": "vue"
  },
  //eslint代码格式化相关配置
  "eslint.validate": [
    "javascript",
    "javascriptreact",
    {
      "language": "vue",
      "autoFix": true
    }
  ],
  // 重新设定tabsize
  "editor.tabSize": 2,
  // 保存自动化
  "editor.formatOnSave": true,
  // 保存时自动fix
  "eslint.autoFixOnSave": true,
  "eslint.run": "onSave",
  //  #让函数(名)和后面的括号之间加个空格
  "javascript.format.insertSpaceBeforeFunctionParenthesis": true,
  // 使用插件格式化 html
  "vetur.format.defaultFormatter.html": "js-beautify-html",
  "vetur.format.defaultFormatter.js": "vscode-typescript",
  "vetur.format.defaultFormatterOptions": {
    "js-beautify-html": {
      "wrap_attributes": "force-aligned"
      // #vue组件中html代码格式化样式
    }
  },
  //  #去掉代码结尾的分号 
  "prettier.semi": false,
  //  #使用带引号替代双引号 
  "prettier.singleQuote": true,
  //默认浏览器为chrome浏览器打开
  "open-in-browser.default": "chrome",
  "workbench.iconTheme": "material-icon-theme",
  "workbench.colorTheme": "One Dark Pro",
  "code-runner.runInTerminal": true,
  "vsicons.dontShowNewVersionMessage": true,
  // "[html]": {
  //   "editor.defaultFormatter": "esbenp.prettier-vscode"
  // },
  "workbench.activityBar.visible": true,
  // "workbench.colorCustomizations": {
  //   // 设置guide线高亮颜色
  //   "editorIndentGuide.activeBackground": "#e82d6b"
  // },
  "workbench.sideBar.location": "left",
  "powermode.enabled": true, //是否开启
  "powermode.enableShake": false,
  "liveServer.settings.donotShowInfoMsg": true,
  "previewServer.port": 9030, //动画效果
  //git配置文件，路径是git.exe绝对路径
  "git:path": "E:\\software\\Git-2.21.0\\Git\\bin\\git.exe",
  "git.autofetch": true,
  "git.enableSmartCommit": true,
  "git.confirmSync": false,
  "svn.enableProposedApi": "none",
  //敲代码的爆炸效果的设置                         
  "powermode.presets": "exploding-rift",
  "powermode.comboThreshold": 1,
  "[html]": {
    "editor.defaultFormatter": "vscode.html-language-features"
  },
  "editor.mouseWheelZoom": true,
  "terminal.integrated.rendererType": "dom",
  "explorer.confirmDragAndDrop": false,
  "javascript.updateImportsOnFileMove.enabled": "always",
  "javascript.implicitProjectConfig.experimentalDecorators": true,
  "explorer.confirmDelete": false,
  // Bracket-Pair-Colorizer-2括号着色自定义
  "bracket-pair-colorizer-2.activeScopeCSS": [
    "borderStyle : solid",
    "borderWidth : 2px",
    "borderColor : {#f22f75}",
    "opacity: 1"
  ],
  // 在装订线中显示活动范围括号
  "bracket-pair-colorizer-2.showBracketsInGutter": true,
  }
           

具体的详细配置在上面了，大家自己看需求配置就OK了！