Vue Vue-cli Eslint 实现在vscode里保存后代码自动格式化

使用Vue-cli构建的项目会启用Eslint检测代码规范，所以很容易因为代码不规范控制台总报错，所以为了解决这个问题，可以配置vscode在ctrl+s的时候自动代码格式化。

---

1.配置环境

npm i -g eslint-plugin-vue
#or
npm i -S eslint-plugin-vue

2.安装插件：eslint 插件和 vetur 插件

3.修改setting.json文件，快捷键打开：ctrl+shift+p

setting.json内容如下：

{
    "git.ignoreMissingGitWarning": true,
    "editor.formatOnPaste": true,
    "editor.formatOnSave": true,
    "window.zoomLevel": 1, //界面的放大等级
    "eslint.validate": [
        "javascript",
        "javascriptreact",
        "html",
        {
            "language": "vue",
            "autoFix": true
        },
        {
            "language": "html",
            "autoFix": true
        }
    ],
    "eslint.options": {
        "plugins": [
            "html"
        ]
    },
    "editor.tabSize": 2,
    "eslint.autoFixOnSave": true,
    "vetur.format.defaultFormatter.js": "vscode-typescript",
    "vetur.format.defaultFormatter.html": "js-beautify-html",
    "git.confirmSync": false,
    "git.autofetch": true,
    "editor.formatOnType": false,
    "git.enableSmartCommit": true,
    "team.showWelcomeMessage": false,
    "editor.fontSize": 16,
    "files.autoSave": "onWindowChange",
    "explorer.confirmDelete": false,
    "terminal.integrated.rendererType": "dom",
    "search.location": "panel",
    "editor.suggestSelection": "first",
    "vsintellicode.modify.editor.suggestSelection": "automaticallyOverrodeDefaultValue",
    "editor.autoIndent": false
}