vscode 插件与setting.json配置

前言

前端开发使用的是vscode，由于没有使用 setting sync 插件，每次新安装的vscode 都需要重新配置，都需要重新去查找。因此在这里做一下记录。

1、插件的使用

我当前使用的插件：Vetur, Debugger for Chrome，Sass，ESlint，Import Cost， Prettier，Path Intellisense, Auto Close Tag, Auto Rename Tag, Bookmarks, Bracket Pair Colorizer, ES7 React/Redux/GraphQL/React-Native snippets, filesize, GitLens, Material Icon Theme

2、setting.json 配置

Ctrl+, 打开设置，搜索setting.json打开， 文件配置

{
  "editor.fontSize": 20, // 编辑器字体大小
  "terminal.integrated.fontSize": 18,	// terminal 框的字体大小
  "editor.tabSize": 2, // Tab 的大小 2个空格
  "editor.formatOnSave": true, // 保存是格式化
  "prettier.singleQuote": true, // 单引号
  "editor.defaultFormatter": "esbenp.prettier-vscode",
  "[vue]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "editor.codeActionsOnSave": {
    "source.fixAll.eslint": true
  },
  "eslint.format.enable": true,
  "eslint.validate": [
    "javascript",
    "javascriptreact",
    "html",
    "vue",
    "typescript",
    "typescriptreact"
  ],

  "workbench.iconTheme": "material-icon-theme",

}

前提

• 编辑器安装了Prettier - Code formatter 插件并启用
• 项目配置了使用eslint

注意

在项目根目录新建.vscode文件夹，文件夹中新建settings.json覆盖全局的setings.json文件，配置同上。