【工具】VSCODE下载，配置初次设置

打开 settings.json 文件，包含了 Visual Studio Code (VSCode) 中的各种用户配置。

{"files.associations": {"*.vue": "vue","*.wpy": "vue","*.wxml": "html","*.wxss": "css"},

• 解释：将特定文件扩展名与对应的语言模式关联。例如，.vue 和 .wpy 文件都被视为 vue 文件，.wxml 视为 html 文件，.wxss 视为 css 文件。这可以确保 VSCode 对这些文件使用正确的语法高亮和格式化。

  "terminal.integrated.shell.windows": "C:\\Windows\\System32\\cmd.exe",

• 解释：设置 VSCode 内置终端使用 Windows 的 cmd.exe 作为默认终端。

  "git.enableSmartCommit": true,"git.autofetch": true,

• 解释：
  • "git.enableSmartCommit"：当设置为 true 时，VSCode 在没有暂存文件时直接提交更改。
  • "git.autofetch"：自动从远程仓库获取最新的 Git 更改。

  "emmet.triggerExpansionOnTab": true,"emmet.showAbbreviationSuggestions": true,"emmet.showExpandedAbbreviation": "always","emmet.includeLanguages": {"vue-html": "html","vue": "html","wpy": "html"},

• 解释：启用 Emmet 语法扩展，可以在 .vue 和 .wpy 文件中使用 HTML 快捷输入（Emmet 支持 HTML 的缩写扩展），并通过按 Tab 键触发 Emmet 扩展。

  "workbench.colorTheme": "Monokai",

• 解释：选择了 Monokai 主题作为 VSCode 的界面配色。

  "git.confirmSync": false,"explorer.confirmDelete": false,

• 解释：
  • "git.confirmSync"：关闭 Git 同步确认。
  • "explorer.confirmDelete"：关闭在文件资源管理器中删除文件时的确认对话框。

  "editor.fontSize": 14,"window.zoomLevel": 1,"editor.wordWrap": "on","editor.detectIndentation": false,"editor.tabSize": 2,

• 解释：
  • "editor.fontSize"：编辑器的字体大小设为 14。
  • "window.zoomLevel"：窗口的缩放级别设为 1，即放大一级。
  • "editor.wordWrap"：开启自动换行。
  • "editor.detectIndentation"：关闭自动检测缩进。
  • "editor.tabSize"：设置 Tab 键的宽度为 2 个空格。

  "files.autoSave": "onFocusChange",

• 解释：文件在失去焦点时自动保存。

  "editor.formatOnSave": false,

• 解释：关闭保存时自动格式化代码。

  "editor.rulers": [],

• 解释：没有设置任何垂直标尺（即代码行限制长度的可视化参考线）。

  "search.exclude": {"**/node_modules": true,"**/bower_components": true,"**/target": true,"**/logs": true},

• 解释：在使用搜索功能时，排除指定的文件夹，如 node_modules、bower_components、target、和 logs 文件夹。

  "files.exclude": {"**/.git": true,"**/.svn": true,"**/.hg": true,"**/CVS": true,"**/.DS_Store": true,"**/*.js": {"when": "$(basename).ts"},"**/node_modules": true},

• 解释：在文件资源管理器中隐藏指定文件和文件夹，如 .git、.svn、.hg、CVS 和 .DS_Store 文件，同时当存在同名的 TypeScript 文件时隐藏生成的 JavaScript 文件（.ts 编译生成的 .js 文件）。

  "vetur.format.defaultFormatter.html": "js-beautify-html","vetur.format.defaultFormatter.js": "prettier","vetur.format.defaultFormatterOptions": {"js-beautify-html": {"wrap_attributes": "force-aligned","wrap_line_length": 200,"end_with_newline": false,"semi": false,"singleQuote": true},"prettier": {"semi": false,"singleQuote": true}}
}

• 解释：
  • vetur 是 Vue 文件的格式化工具。
  • 设置 js-beautify-html 为 Vue 组件中 HTML 代码的默认格式化工具。
  • 设置 prettier 为 JavaScript 代码的格式化工具，并指定格式化规则，如使用单引号（singleQuote）和去掉语句结尾的分号（semi）。

小结

这份配置文件通过设置文件关联、编辑器样式、Git 操作行为、Emmet 支持、代码格式化工具等多个选项来优化 Visual Studio Code 的开发体验。这些设置可以提高效率和舒适度，特别是在前端开发（如 Vue.js）和版本控制上。