Visual Studio Code 扩展

主题相关

React 相关

  • ES7 React/Redux/GraphQL/React-Native snippets

Vue 相关

CSS 相关

微信小程序相关

  • minapp
    • 微信小程序标签、属性的智能补全(同时支持原生小程序、mpvuewepy 框架,并提供 snippets)
    • 插件地址open in new window

Markdown 相关

Git 相关

格式化相关

调试相关

其他

webpack 项目识别 alias

  1. 在项目根目录新建 jsconfig.jsontsconfig.json
  2. 添加以下代码,其中 paths 字段的值要与你项目配置的 alias 一致
{
  "compilerOptions": {
    "baseUrl": ".",
    "paths": {
      "@/*": ["src/*"]
    }
  },
  "include": ["src"]
}
1
2
3
4
5
6
7
8
9

推荐配置

// 将设置放入此文件中以覆盖默认设置
{
  "files.autoSave": "off",
  "files.autoSaveDelay": 1500,
  "editor.tabSize": 2,
  // 关闭快速预览
  "editor.minimap.enabled": true,
  "editor.wordWrap": "on",
  "editor.lineNumbers": "on",
  "editor.quickSuggestions": {
    "other": true,
    "comments": true,
    "strings": true
  },
  // bug控制缩进不关tabSize修改无用
  "editor.detectIndentation": false,
  // 保存格式化
  "editor.formatOnSave": true,
  "editor.codeActionsOnSave": {
    // "source.organizeImports": true,
    "source.fixAll": true,
    "source.fixAll.eslint": true
  },
  // eslint 配置
  "eslint.options": {
    "extensions": ["js", ".vue"]
  },
  "eslint.format.enable": true,
  "eslint.validate": [
    "vue",
    "html",
    "javascript",
    "javascriptreact",
    "jsx",
    "typescript",
    "typescriptreact"
  ],
  "prettier.semi": false,
  // 是否使用单引号
  "prettier.singleQuote": true,
  "prettier.printWidth": 100,
  "prettier.packageManager": "yarn",
  "prettier.trailingComma": "none",
  "[javascript]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "[javascriptreact]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "[typescript]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "[typescriptreact]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "[vue]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "workbench.colorTheme": "Bluloco Dark",
  // 编辑器配置
  "workbench.iconTheme": "material-icon-theme",
  "workbench.editor.enablePreview": false,
  "emmet.triggerExpansionOnTab": true,
  "emmet.includeLanguages": {
    "vue-html": "html",
    "javascript": "javascriptreact",
    "wxml": "html"
  },
  // 搜索配置
  "search.exclude": {
    "**/node_modules": true,
    "**/bower_components": true,
    "**/dist": true
  },
  "gitlens.keymap": "alternate",
  "explorer.confirmDragAndDrop": false,
  "vetur.format.defaultFormatter.html": "prettyhtml",
  "vetur.format.defaultFormatter.js": "prettier-eslint",
  "vetur.format.defaultFormatterOptions": {
    "prettyhtml": {
      "printWidth": 80, // No line exceeds 100 characters
      "singleQuote": false // Prefer double quotes over single quotes
    },
    "prettier": {
      // 是否添加分号
      "semi": false,
      // 是否使用单引号
      "singleQuote": true,
      "eslintIntegration": true,
      "parser": "babylon"
    }
  },
  "javascript.implicitProjectConfig.experimentalDecorators": true,
  "javascript.updateImportsOnFileMove.enabled": "always",
  "files.associations": {
    "*.cjson": "jsonc",
    "*.wxss": "css",
    "*.wxs": "javascript",
    "*.vue": "vue"
  },
  // 微信小程序
  "minapp-vscode.disableAutoConfig": true,
  "gitlens.advanced.messages": {
    "suppressShowKeyBindingsNotice": true
  },
  "highlight-matching-tag.styles": {
    "opening": {
      "left": {
        "custom": {
          "borderWidth": "0 0 0 4px",
          "borderStyle": "solid",
          "borderColor": "LightSkyBlue",
          "borderRadius": "5px"
        }
      },
      "right": {
        "custom": {
          "borderWidth": "0 4px 0 0",
          "borderStyle": "solid",
          "borderColor": "LightSkyBlue",
          "borderRadius": "5px"
        }
      }
    }
  },
  "less.compile": {
    "outExt": "wxss"
  },
  "typescript.updateImportsOnFileMove.enabled": "always",
  "markdownlint.config": {
    "MD001": false,
    "MD024": false,
    "MD033": false
  },
  "scm.defaultViewMode": "tree",
  "settingsSync.ignoredSettings": [
    "window.zoomLevel",
  ],
  "cSpell.ignoreWords": [
    "antd",
    "ahooks"
  ]
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
上次更新:
(adsbygoogle = window.adsbygoogle || []).push({});