vscode 自定配置settings.json

{
    // vscode默認啟用了根據文件類型自動設置tabsize的選項
    "editor.detectIndentation": false,
    // 重新設定tabsize
    "editor.tabSize": 2,
    // #值設置為true時，每次保存的時候自動格式化；值設置為false時，代碼格式化請按shift+alt+F
    "editor.formatOnSave": false,
    // #每次保存的時候將代碼按eslint格式進行修復
    "eslint.autoFixOnSave": false,
    // 添加 vue 支持
    "eslint.validate": [
        "javascript",
        "javascriptreact",
        {
            "language": "vue",
            "autoFix": true
        }
    ],
    //  #讓prettier使用eslint的代碼格式進行校驗
    "prettier.eslintIntegration": true,
    //  #去掉代碼結尾的分號
    "prettier.semi": false,
    //  #使用帶引號替代雙引號
    "prettier.singleQuote": true,
    "prettier.tabWidth": 2,
    //  #讓函數(名)和后面的括號之間加個空格
    "javascript.format.insertSpaceBeforeFunctionParenthesis": true,
    // #這個按用戶自身習慣選擇
    "vetur.format.defaultFormatter.html": "js-beautify-html",
    // #讓vue中的js按"prettier"格式進行格式化
    "vetur.format.defaultFormatter.js": "prettier",
    "vetur.format.defaultFormatterOptions": {
        "js-beautify-html": {
            // #vue組件中html代碼格式化樣式
            "wrap_attributes": "auto", //也可以設置為“auto”，效果會不一樣
            "wrap_line_length": 200,
            "end_with_newline": false,
            "semi": false,
            "singleQuote": true
        },
        "prettier": {
            "semi": false,
            "singleQuote": true
        }
    },
    "[jsonc]": {
        "editor.defaultFormatter": "esbenp.prettier-vscode"
    },
    // 格式化stylus, 需安裝Manta's Stylus Supremacy插件
    "stylusSupremacy.insertColons": false, // 是否插入冒號
    "stylusSupremacy.insertSemicolons": true, // 是否插入分號
    "stylusSupremacy.insertBraces": false, // 是否插入大括號
    "stylusSupremacy.insertNewLineAroundImports": false, // import之后是否換行
    "stylusSupremacy.insertNewLineAroundBlocks": false,
    "prettier.useTabs": true,
    "files.autoSave": "off",
    "explorer.confirmDelete": false,
    "[javascript]": {
        "editor.defaultFormatter": "HookyQR.beautify"
    },
    "[json]": {
        "editor.defaultFormatter": "esbenp.prettier-vscode"
    },
    "diffEditor.ignoreTrimWhitespace": false,
    "editor.codeActionsOnSave": {
        "source.fixAll.eslint": true
    },
    "[vue]": {
        "editor.defaultFormatter": "octref.vetur"
    },
    "git.suggestSmartCommit": false,
    "terminal.integrated.defaultProfile.windows": "Git Bash",
    "git.confirmSync": false,
    "explorer.confirmDragAndDrop": false,
    "[html]": {
        "editor.defaultFormatter": "HookyQR.beautify"
    },
    "editor.fontLigatures": null // 兩個選擇器中是否換行
}

 

{
    "workbench.colorTheme": "Default Dark+",
    "beautify.config": {
        "indent_size": "2",
        "indent_char": " ",
        "indent_with_tabs": false,
        "eol": "\r\n",
        "end_with_newline": false,
        "indent_level": 0,
        "preserve_newlines": true,
        "max_preserve_newlines": 3,
        "space_in_paren": false,
        "space_in_empty_paren": false,
        "jslint_happy": false,
        "space_after_anon_function": false,
        "brace_style": "none,preserve-inline",
        "unindent_chained_methods": false,
        "break_chained_methods": false,
        "keep_array_indentation": false,
        "unescape_strings": false,
        "wrap_line_length": 95,
        "e4x": false,
        "comma_first": false,
        "operator_position": "before-newline",
        "unformatted": [
            "wbr"
        ],
        "html": {
            "indent_handlebars": true,
            "indent_inner_html": true,
            "indent-scripts": "normal",
            "extra_liners": []
        }
    },
    "beautify.language": {
        "html": [
            "htm",
            "html",
            "vue"
        ],
        "js": {
            "type": [
                "javascript",
                "typescript",
                "json"
            ],
            "filename": [
                ".jshintrc",
                ".jsbeautify"
            ]
        },
        "css": [
            "css",
            "scss",
            "less"
        ]
    },
    "[javascript]": {
        "editor.defaultFormatter": "HookyQR.beautify"
    },
    "[html]": {
        "editor.defaultFormatter": "HookyQR.beautify"
    },
    "[vue]": {
        "editor.defaultFormatter": "HookyQR.beautify"
    },
    "[typescript]": {
        "editor.defaultFormatter": "HookyQR.beautify"
    }
}