VScode中开发vue代码提示及格式化配置

安装vetur、Vue 2 Snippets、ESlint、prettier插件

注：ESlint需安装在项目开发环境中或全局安装     
$ npm install eslint --save-dev
$ npm install eslint --global

在文件–>首选项–>设置里面打开settings.json文件，设置以下配置

settings.js

{
  "workbench.editor.enablePreview": false, //打开文件不覆盖
  "editor.minimap.enabled": false, //关闭快速预览
  "editor.formatOnSave": false, //每次保存自动格式化
  "editor.codeActionsOnSave": { // 每次保存的时候将代码按eslint格式进行修复
    "source.fixAll.eslint": true
  },
  "javascript.format.insertSpaceBeforeFunctionParenthesis": true, //让函数(名)和后面的括号之间加个空格
  "vetur.format.defaultFormatter.html": "js-beautify-html", //格式化.vue中html
  "vetur.format.defaultFormatter.js": "vscode-typescript", //让vue中的js按编辑器自带的ts格式进行格式化
  "vetur.format.defaultFormatterOptions": {
    "js-beautify-html": {
      "wrap_attributes": "force-aligned" //属性强制折行对齐
    }
  },
  "[vue]": {
    "editor.defaultFormatter": "octref.vetur"
  }
}

.prettierrc

{
  "eslintIntegration": true,
  "semi": false,
  "singleQuote": true
}