实用的VSCode 插件和配置推荐

比伯
885 阅读2分钟

一个好的前端码农，拥有一款主题简单，编码舒服的编辑器是必不可少的。从之前的Adobe Dreamweaver到webStorm,再到现在的VScode我都用过，而现今需要编辑器都具有IDE功能，VsCode是我认为迄今为止用的最舒服的一款编辑器，配置简单，界面舒服。

我的编辑器外观

编辑器外观

配置settings.json

{
    "workbench.colorTheme": "Solarized Dark",
    "editor.minimap.enabled": false,
    "editor.fontFamily": "Fira Code, Menlo, Monaco, 'Courier New', monospace",
    // Fira Code 支持需要开启
    "editor.fontLigatures": true,
    "editor.tabSize": 2,
    "editor.lineHeight": 24,
    "editor.lineNumbers": "on",
    "editor.renderIndentGuides": false,
    "vetur.format.defaultFormatter.js": "vscode-typescript",
    "vetur.format.defaultFormatter.html": "js-beautify-html",
    "eslint.validate": [
        "javascript",
        "javascriptreact",
        {
            "language": "html",
            "autoFix": true
        },
        {
            "language": "vue",
            "autoFix": true
        }
    ],
    // 保存自动修复
    "eslint.autoFixOnSave": true,
    "editor.wordSeparators": "`~!@#$%^&*()=+[{]}\\|;:'\",.<>/?",
    // 参考线
    "guides.normal.color.dark": "rgba(91, 91, 91, 0.6)",
    "guides.normal.color.light": "rgba(220, 220, 220, 0.7)",
    "guides.active.color.dark": "rgba(210, 110, 210, 0.6)",
    "guides.active.color.light": "rgba(200, 100, 100, 0.7)",
    "guides.active.style": "dashed",
    "guides.normal.style": "dashed",
    "guides.stack.style": "dashed",
    "editor.wordWrap": "on",
    "todohighlight.isEnable": true,
    "workbench.iconTheme": "eq-material-theme-icons",
    // 缩进规则，主要看公司要求和个人习惯
    "[javascript]": {
        "editor.insertSpaces": true,
        "editor.tabSize": 2
    },
    // 设置选中范围是尖角还是圆角
    "editor.roundedSelection": true,
    // 将一些不必要的搜索范围去掉
    "search.exclude": {
        "**/node_modules": true,
        "**/bower_components": true,
        "**/dist": true,
        "**/.git": true
    },
    "editor.fontSize": 13,
    "workbench.tree.indent": 14,
    "breadcrumbs.enabled": false,
}

配置文件中涉及到的插件

avatar
文章
阅读
粉丝