VS Code 配置及其插件

迷途橘

2021 年 12 月 15 日

47 次浏览

暂无评论

1794字数

开发工具

> 主要用于VUE开发，快速以Eslint规范进行代码格式化

### 配置

> 它可以格式化大部分文件格式，但vue文件中的样式部分无法格式化

```json
{
  // 默认图标
  "workbench.iconTheme": "vscode-icons",
  // 关闭vetur警告
  "vetur.ignoreProjectWarning": true,
  // 每次保存的时候将代码按eslint格式进行修复
  "editor.codeActionsOnSave": {
    "source.fixAll.eslint": true
  },
  // eslint文件支持
  "eslint.validate": [
    // 添加 vue 支持
    "javascript",
    "javascriptreact",
    "typescript",
    "typescriptreact",
    "html",
    "vue",
    "js",
    "css",
    "less",
    "sass"
  ],
  "[css]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "[less]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "[sass]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "[html]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  //  指定vetur默认格式化
  "vetur.format.defaultFormatter.js": "prettier-eslint",
  "editor.formatOnSave": true,
  // 自动保存
  "files.autoSave": "afterDelay",
  "prettier.trailingComma": "es5",
  "prettier.semi": false,
  "prettier.jsxSingleQuote": true,
  "prettier.singleQuote": true,
  "editor.tabSize": 2,
  "javascript.updateImportsOnFileMove.enabled": "always",
  "explorer.confirmDragAndDrop": false,
  "security.workspace.trust.untrustedFiles": "open",
  "typescript.updateImportsOnFileMove.enabled": "always",
  "window.zoomLevel": 1,
  "commentTranslate.source": "Bing",
  "diffEditor.renderSideBySide": false,
  "workbench.editorAssociations": {
    "*.html": "default"
  }
}
```

### 插件

![Snipaste_2021-12-15_11-09-43-050132024ac846bb97805a5892062305.png][1]

![Snipaste_2021-12-15_11-10-08-25f7421a897f47379d5f4cbaa4595456.png][2]

[1]: /usr/uploads/2022/12/1090072202.png
  [2]: /usr/uploads/2022/12/2267089242.png

最后修改：2022 年 12 月 07 日