问题一：在非严格模式下使用vetur插件

问题描述：

• Visual Studio Code已经安装Vetur插件，但是按下Alt + Shift + F并没有反应。

解决问题：

• 打开Visual Studio Code，菜单栏选择文件——首选项——设置，把下面的代码完整覆盖右侧用户设置：

"window.zoomLevel": 0,
"extensions.ignoreRecommendations": true,
"emmet.syntaxProfiles": {
    "vue-html": "html",
    "vue": "html"
},
"vetur.validation.template": false,
"eslint.options": {
    "plugins": ["html"]
},
"eslint.validate": [
    "javascript",
    "javascriptreact",
    "html",
    "vue"
],
"prettier.singleQuote": true,
"prettier.semi": false,
"vetur.format.defaultFormatter.html": "js-beautify-html",
"vetur.format.defaultFormatterOptions": {
   "wrap_attributes": "force-aligned"
 }

问题二：在严格模式eslint下使用vetur插件

• 首先安装好eslin插件，通过保存，可以自动格式化成eslin代码，但是按下Shift+Alt+F代码没有正常缩进，只需要配置如下，在VSCode中按下Ctrl+Shift+P，然后输入Open User Settings，然后加入如下代码：

{
    "files.autoSave": "afterDelay",
    //vetur设置
    "vetur.format.defaultFormatter.html": "prettier",
    //eslint设置
    "eslint.autoFixOnSave": true,
    "eslint.validate": [
        "javascript",
        "javascriptreact",
        {
            "language": "html",
            "autoFix": true
        },
        {
            "language": "vue",
            "autoFix": true
        }
    ]
}

3、最新方法：//www.greatytc.com/p/23a5d6194a4b

{
     // vscode默认启用了根据文件类型自动设置tabsize的选项
    "editor.detectIndentation": false,
    // 重新设定tabsize
    "editor.tabSize": 2,
    // #每次保存的时候自动格式化 
    "editor.formatOnSave": true,
    // #每次保存的时候将代码按eslint格式进行修复
    "eslint.autoFixOnSave": true,
    // 添加 vue 支持
    "eslint.validate": [
        "javascript",
        "javascriptreact",
        {
            "language": "vue",
            "autoFix": true
        }
    ],
    //  #让prettier使用eslint的代码格式进行校验 
    "prettier.eslintIntegration": true,
    //  #去掉代码结尾的分号 
    "prettier.semi": false,
    //  #使用带引号替代双引号 
    "prettier.singleQuote": true,
    //  #让函数(名)和后面的括号之间加个空格
    "javascript.format.insertSpaceBeforeFunctionParenthesis": true,
    // #这个按用户自身习惯选择 
    "vetur.format.defaultFormatter.html": "js-beautify-html",
    // #让vue中的js按编辑器自带的ts格式进行格式化 
    "vetur.format.defaultFormatter.js": "vscode-typescript",
    "vetur.format.defaultFormatterOptions": {
        "js-beautify-html": {
            "wrap_attributes": "force-aligned"
            // #vue组件中html代码格式化样式
        }
    },
    // 格式化stylus, 需安装Manta's Stylus Supremacy插件
    "stylusSupremacy.insertColons": false, // 是否插入冒号
    "stylusSupremacy.insertSemicolons": false, // 是否插入分好
    "stylusSupremacy.insertBraces": false, // 是否插入大括号
    "stylusSupremacy.insertNewLineAroundImports": false, // import之后是否换行
    "stylusSupremacy.insertNewLineAroundBlocks": false // 两个选择器中是否换行
}

参考博文：

• https://segmentfault.com/q/1010000012529764/a-1020000012530128
  https://blog.csdn.net/latency_cheng/article/details/80409202