主題設定

• 顏色主題 One Dark Pro
• 圖示主題 vscode-icons

格式化

• Prettier

程式碼檢查

• ESLint: 檢查 js 語法規範
• TSLint: TypeScript檢測
• Stylelint: 檢查 CSS/SCSS/Less 語法規範
• Markdownlint: 檢查 markdown 語法規範

自動補全

• Auto Close Tag: 自動閉合 html 等標籤 （</...>）
• Auto Rename Tag: 修改 html 標籤時，自動修改閉合標籤）
• Path Intellisense: 自動提示補全路徑
• Path Autocomplete: 自動補全路徑

功能擴充套件

• Chinese (Simplified) Language Pack for Visual Studio Code: 設定中文
• Live Server: 一鍵在本地啟動伺服器
• Vetur: Vue語法格式支援
• Sass: Sass支援:
• Settings Sync: 同步編輯器配置
• koro1FileHeader: 註釋模板

小程式外掛

• minapp: 微信小程式標籤、屬性的智慧補全
• Dot Template: 自動寫入專案模板中的檔案

自定義配置(User Settings)

{
    "editor.fontFamily": "Menlo, Consolas, 'Courier New', monospace",
    "editor.fontLigatures": true,
    "editor.fontSize": 24,
    "editor.fontWeight": "500",
    "editor.lineHeight": 24,
    "editor.lineNumbers": "on",
    "editor.minimap.enabled": false,
    "editor.renderIndentGuides": false,
    "editor.rulers": [120],
    "editor.formatOnPaste": true,
    "workbench.colorTheme": "One Dark Pro",
    "workbench.iconTheme": "vscode-icons",
    "vsicons.dontShowNewVersionMessage": true,
    "explorer.confirmDelete": false,
    "terminal.integrated.fontFamily": "monospace",
    // "eslint.autoFixOnSave": true,
    "editor.formatOnSave": true,
    "eslint.validate": [
        "javascript",
        "javascriptreact",
        {
            "language": "html",
            "autoFix": true
        },
        {
            "language": "vue",
            "autoFix": true
        },
        {
            "language": "typescript",
            "autoFix": true
        },
        "typescriptreact"
    ],
    "eslint.options": {
        "plugins": ["html"]
    },
    "editor.tokenColorCustomizations": {
        "textMateRules": [
            {
                "name": "Comments",
                "scope": "comment, punctuation.definition.comment",
                "settings": {
                    "fontStyle": ""
                }
            },
            {
                "name": "js/ts italic",
                "scope": "entity.other.attribute-name.js,entity.other.attribute-name.ts,entity.other.attribute-name.jsx,entity.other.attribute-name.tsx,variable.parameter,variable.language.super",
                "settings": {
                    "fontStyle": ""
                }
            },
            {
                "name": "js ts this",
                "scope": "var.this,variable.language.this.js,variable.language.this.ts,variable.language.this.jsx,variable.language.this.tsx",
                "settings": {
                    "fontStyle": ""
                }
            }
        ]
    },
    "files.autoSave": "afterDelay",
    "window.zoomLevel": 0,
    "terminal.integrated.shell.windows": "C:\\Windows\\System32\\WindowsPowerShell\\v1.0\\powershell.exe",
    "search.location": "panel",
    // prettier外掛 自動化格式程式碼設定
    "prettier.eslintIntegration": true,
    "prettier.singleQuote": true, // 強制單引號
    "prettier.trailingComma": "all", // 尾隨逗號
    "prettier.tabWidth": 4, // 4格縮排
    "prettier.arrowParens": "always", // 圍繞箭頭函式引數強制使用括號
    "editor.detectIndentation": false,
    "editor.tabCompletion": "on",
    "liveServer.settings.donotShowInfoMsg": true,
    "typescript.updateImportsOnFileMove.enabled": "always",
    // vetur格式化外掛的配置
    "vetur.format.defaultFormatter.html": "js-beautify-html",
    "vetur.format.defaultFormatter.js": "vscode-typescript",
    "vetur.format.defaultFormatter.ts": "vscode-typescript",
    "vetur.format.options.tabSize": 4,
    "vetur.format.defaultFormatterOptions": {
        "js-beautify-html": {
            "wrap_attributes": "force-aligned"
        },
        "prettyhtml": {
            "printWidth": 100,
            "singleQuote": true,
            "wrapAttributes": false,
            "sortAttributes": false
        }
    },
    "files.associations": {
        "*.cjson": "jsonc",
        "*.wxss": "css",
        "*.wxs": "javascript"
    },
    "emmet.includeLanguages": {
        "wxml": "html"
    },
    "minapp-vscode.disableAutoConfig": true,
    "sync.gist": "e9ec7974d53f0325e050467baabafc3a",

    // koroFileHeader外掛配置修改
    "fileheader.configObj": {
        "timeNoDetail": true
    },
    // 頭部註釋
    "fileheader.customMade": {
        "Description": "file content",
        "Author": "tgb",
        "Date": "Do not edit"
    }
}

複製程式碼