1.在VScode中打开文件 → 首选项 → 用户代码片段 → 在搜索框中搜索 JavaScript 选择 JavaScript.json
![image.png](https://p6-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/790cd5ada8e84fda9aa14f90b98adb72~tplv-k3u1fbpfcp-zoom-in-crop-mark:1512:0:0:0.awebp?)
{
// Place your snippets for javascript here. Each snippet is defined under a snippet name and has a prefix, body and
// description. The prefix is what is used to trigger the snippet and the body will be expanded and inserted. Possible variables are:
// $1, $2 for tab stops, $0 for the final cursor position, and ${1:label}, ${2:another} for placeholders. Placeholders with the
// same ids are connected.
// Example:
"Print to console": {
"prefix": "clog",
"body": [
"console.log('$1');",
],
"description": "Log output to console"
}
}
![image.png](https://p9-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/b5076a0091894c619296d46d66836050~tplv-k3u1fbpfcp-zoom-in-crop-mark:1512:0:0:0.awebp?)
![image.png](https://p6-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/b002d080a5ed4649856b6baba6336f96~tplv-k3u1fbpfcp-zoom-in-crop-mark:1512:0:0:0.awebp?)
![image.png](https://p1-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/c4c06b86d89749409c7c305a8a75f56b~tplv-k3u1fbpfcp-zoom-in-crop-mark:1512:0:0:0.awebp?)
以下是个人的vsCode常用配置
![image.png](https://p9-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/777f83ca07b540dcb4299967bce8207b~tplv-k3u1fbpfcp-zoom-in-crop-mark:1512:0:0:0.awebp?)
{
"liveServer.settings.donotShowInfoMsg": true,
"[html]": {
"editor.defaultFormatter": "vscode.html-language-features"
// "editor.defaultFormatter": "lonefy.vscode-JS-CSS-HTML-formatter"
},
"cssrem.rootFontSize": 100,
//标签补全
"emmet.triggerExpansionOnTab": true,
// vscode默认启用了根据文件类型自动设置tabsize的选项
"editor.detectIndentation": false,
// 重新设定tabsize
//"editor.tabSize": 2,
"files.autoSave": "off",
"editor.codeActionsOnSave": {
"source.fixAll.eslint": true
},
"vscode_custom_css.imports": [
"file:///C:/Users/86152/.vscode/extensions/webrender.synthwave-x-fluoromachine-0.0.12/vscode-xxx.css"
],
// #每次保存的时候自动格式化
// "editor.formatOnSave": true,
"diffEditor.ignoreTrimWhitespace": false,
"git.suggestSmartCommit": false,
"workbench.sideBar.location": "left",
"gitlens.hovers.currentLine.over": "line",
"git.path": "E:/Git/Git/cmd/git.exe",
"fileheader.cursorMode": {
"example": "",
// "Date": "Do not edit", // 文件创建时间(不变)
"param": "",
"return": {}
},
"fileheader.configObj": {
"autoAdd": false, // 自动添加头部注释开启才能自动添加
"autoAlready": false // 默认开启
},
"editor.fontSize": 15,
// "editor.cursorStyle": "block",
"editor.cursorSmoothCaretAnimation": true,
"editor.cursorBlinking": "phase",
// "workbench.colorCustomizations": {
// // 设置光标颜色
// "editorCursor.foreground": "#CF2C80"
// },
"explorer.confirmDelete": false,
"editor.minimap.enabled": false,
"editor.renderControlCharacters": false,
"files.associations": {
"*.vue": "vue"
},
"editor.tokenColorCustomizations": null,
"editor.fontFamily": "'Fira Code',Consolas, 'Courier New', monospace",
"editor.fontLigatures": true,
"editor.renderWhitespace": "all",
"remote.extensionKind": {},
"terminal.integrated.shell.windows": "C:\\WINDOWS\\System32\\WindowsPowerShell\\v1.0\\powershell.exe",
"editor.suggestSelection": "first",
"vsintellicode.modify.editor.suggestSelection": "automaticallyOverrodeDefaultValue",
"winopacity.opacity": 235,
"javascript.implicitProjectConfig.experimentalDecorators": true,
"breadcrumbs.filePath": "last",
"eslint.codeAction.showDocumentation": {
"enable": true
},
"editor.codeActionsOnSave": {
"source.fixAll.eslint": true
},
"files.eol": "\n",
"files.trimTrailingWhitespace": true,
"[scss]": {
"editor.suggest.insertMode": "replace",
"gitlens.codeLens.scopes": [
"document"
]
},
"workbench.editor.openPositioning": "left",
"workbench.iconTheme": "material-icon-theme",
"debug.internalConsoleOptions": "neverOpen",
"less.lint.fontFaceProperties": "ignore",
"debug.showInStatusBar": "never",
"editor.suggest.showStatusBar": true
}
常用插件的推荐:
1.快捷百度搜索
2.Auto Close Tag
3.Auto Rename Tag
4.Bookmarks
5.Bracket Pair Colorizer
6.change-case
7.Chinese (Simplified) (简体中文) Language Pack for Visual Studio Code
8.Easy LESS
9.ESLint
10.Git History
11.git-commit-plugin
12.GitLens — Git supercharged
13.HTML CSS Support
14.HTML Snippets
15.JavaScript (ES6) code snippet
16.Live Server
17.Material Icon Theme
18.npm
19.Path Intellisense
20.Vetur
21.vscode-icons
22.vue VSCode Snippets
![image.png](https://p6-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/530c9d87eabf410e80a8f7f15926e11e~tplv-k3u1fbpfcp-zoom-in-crop-mark:1512:0:0:0.awebp?)
![image.png](https://p3-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/59f499af99704d36b45577a998785bab~tplv-k3u1fbpfcp-zoom-in-crop-mark:1512:0:0:0.awebp?)
![image.png](https://p6-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/bcc1bbe6faa14be1a3401b717daac9dd~tplv-k3u1fbpfcp-zoom-in-crop-mark:1512:0:0:0.awebp?)
|