安裝插件prettier
打開設(shè)置的settings.json文件
增加以下項(xiàng)

/*
     *這一段是Vue3的配置，勿刪?。?！
     */
    "vetur.format.defaultFormatter.js": "vscode-typescript",
    "vetur.format.defaultFormatter.html": "js-beautify-html",
    /*
     *eslint是JavaScript的語法規(guī)則校驗(yàn)器！
     */
    "eslint.validate": [
        "javascript",
        "javascriptreact",
        {
            "language": "html",
            "autoFix": true
        },
        {
            "language": "vue",
            "autoFix": true
        }
    ],

    // 保存自動修復(fù)
    "eslint.autoFixOnSave": true,
    // jsx自動修復(fù)有問題，取消js的format
    "editor.formatOnSave": true,
    //默認(rèn)JavaScript格式化程序(為了更美觀)
    "javascript.format.enable": true,
    /*
     *prettier插件的配置是格式化代碼，更漂亮！
     */
    //如果為真，將使用單引號而不是雙引號
    "prettier.singleQuote": false,
    //點(diǎn)擊保存時，根據(jù) eslint 規(guī)則自定修復(fù)，同時集成 prettier 到 eslint 中
    "prettier.eslintIntegration": true,
    //prettier自動格式化tab的空格數(shù)量！
    "prettier.tabWidth": 4,
    // Indent lines with tabs
    "prettier.useTabs": true

增加eslint配置，創(chuàng)建.eslintrc.js文件

module.exports = {
    root: true,
    env: {
        node: true,
    },
    extends: ["plugin:vue/essential", "eslint:recommended"],
    parserOptions: {
        parser: "babel-eslint",
    },
    plugins: [
        "vue", // 增加此配置項(xiàng)
    ],
    rules: {
        "no-console": process.env.NODE_ENV === "production" ? 1 : "off",
        "no-debugger": process.env.NODE_ENV === "production" ? 1 : "off",
        "no-alert": 0, //禁止使用alert confirm prompt
        "vue/html-indent": [
            "error",
            2,
            {
                baseIndent: 1,
            },
        ],
        "no-const-assign": 2, //禁止修改const聲明的變量
        "no-empty": 2, //塊語句中的內(nèi)容不能為空
        "no-eq-null": 2, //禁止對null使用==或!=運(yùn)算符
        // "no-floating-decimal": 2,//禁止省略浮點(diǎn)數(shù)中的0 .5
        // "no-implicit-coercion": 1,//禁止隱式轉(zhuǎn)換
        "no-multi-spaces": 1, //不能用多余的空格
        "no-nested-ternary": 0, //禁止使用嵌套的三目運(yùn)算
        "no-param-reassign": 2, //禁止給參數(shù)重新賦值
        "no-redeclare": 2, //禁止重復(fù)聲明變量
        "no-mixed-spaces-and-tabs": 0,//禁止混用tab和空格
        "no-trailing-spaces": 0,
        "block-scoped-var": 0, //塊語句中使用var
        camelcase: 0, //強(qiáng)制駝峰法命名
        // eqeqeq: 2, //必須使用全等
        indent: [2, 2], //縮進(jìn)風(fēng)格
        "key-spacing": [
            0,
            {
                beforeColon: false,
                afterColon: true,
            },
        ], //對象字面量中冒號的前后空格
        "max-params": [0, 5], //函數(shù)最多只能有3個參數(shù)
        "no-unused-vars": [2, { 
            // 允許聲明未使用變量
            "vars": "local",
            // 參數(shù)不檢查
            "args": "none" 
        }],
        "no-undef": 1,//不能有未定義的變量
        "no-trailing-spaces": 1,//一行結(jié)束后面不要有空格
        "no-sparse-arrays": 2,//禁止稀疏數(shù)組， [1,,2]
        "no-redeclare": 2,//禁止重復(fù)聲明變量
        "no-multiple-empty-lines": [1, {"max": 3}],//空行最多不能超過2行
        "no-extra-semi": 2,//禁止多余的冒號
        "block-scoped-var": 2,//禁止塊語句中使用var
        strict: 2, //使用嚴(yán)格模式
        "vars-on-top": 2, //var必須放在作用域頂部
        // "invalid-first-character-of-tag-name": 2, //三元運(yùn)算符可以使用小于號
    },
};

保存，項(xiàng)目重啟 ok