vsCode 的安装遇到的问题，随笔一记：
Notes：每次安装后打开vsCode重启一下。
1.百度下载，按步骤安装即可。
2.自动集成了Emmet插件，但是快捷键需要修改，点开文件F--首选项 p-- 键盘快捷方式 修改键盘快捷键
3. 安装路径提示或路径补全插件， Path Autocomplete 点击 Path Autocomplete - Visual Studio Marketplace，打开下载，把vsCode先关闭，安装下载的文件，安装完后打开vsCode，安装完后，vsCode变成了英文，需要汉化的转第五步。
4.安装浏览器快捷键，点击左侧第五个按钮
，搜索 view-in-browser，点击 install，然后点击reload即可。点开看的话，点击左边的第一个按钮
，然后点击你要打开的html右击选择view in browser即可
5.英文变为中文 要在Ctrl shfit p 里面输入 configur language，打开的文件配置修改一下，英文 输入 en-Us；
如需配置中文输入：zh-CN
========2023-2-16=========后续跟进==vscode配置=======
Visual Studio Code的安装与配置
1.所需软件：VSCodeUserSetup-x64-1.36.1.exe
2.安装Visual Studio Code及扩展
- 需安装的插件
Auto Close Tag
Auto Rename Tag
Beautify
ESLint
JavaScript (ES6) code snippets
Vetur
（2）需卸载的插件
TSLink Vue
（3）建议安装的主题扩展
Chinolor
单击左侧的方形扩展图标，打开扩展商店； 在搜索栏中输入：TSLint Vue，卸载后点击重新加载按钮；
如果未发现要卸载的插件，可跳过此步骤！
3.配置Visual Studio Code的代码格式化
- 点击菜单 文件 --> 首选项 --> 设置 --> 编辑器中的大括号； 复制如下内容并替换setting.json 中的设置：
{
"editor.fontSize": 16,
"editor.tabSize": 2, // 编辑器缩进设置
"editor.formatOnSave": true, // 保存时自动格式化
"editor.formatOnPaste": true, // 粘贴时自动格式化
"javascript.preferences.quoteStyle": "single", // js格式化为单引号
"typescript.preferences.quoteStyle": "single", // ts格式化为单引号
// ↓↓beutify插件设置
"beautify.config": {
"indent_size": 2, // js自动格式化缩进设置
"end_with_newline": true, // 文件结束时增加空行
"brace_style": "collapse,preserve-inline", // 大括号格式化设置
"wrap_line_length": 120
},
"vetur.format.defaultFormatter.html": "js-beautify-html", // vetur插件格式化html设置
"vetur.format.defaultFormatter.js": "vscode-typescript", // vetur插件格式化js设置
"vetur.format.defaultFormatter.ts": "vscode-typescript", //vetur格式化typescript设置
// ↓↓vetur默认格式化设置
"vetur.format.defaultFormatterOptions": {
"js-beautify-html": {
"wrap_attributes": "auto", // 使html代码的属性保持在行内，除非达到最大行宽，否则不折行
"wrap_line_length": 120 // 最大行宽
}
},
"eslint.validate": [
"javascript",
"javascriptreact",
"html",
"vue"
],
"explorer.confirmDelete": false,
"node-workspace-builder.buildModulesWithoutInstall": true,
"[javascript]": {
"editor.defaultFormatter": "HookyQR.beautify"
},
"[vue]": {
"editor.defaultFormatter": "octref.vetur"
},
"html.format.wrapLineLength": 120,
"editor.codeActionsOnSave": {
"source.fixAll.eslint": true
},
"eslint.codeAction.showDocumentation": {
"enable": true
},
"editor.wordWrapColumn": 120,
"workbench.editor.enablePreview": false
}- 关闭用户设置标签页；
4.创建工作区
打开VS Code，从菜单栏中选择文件 -> 打开文件夹并打开你的源代码文件夹，然后选择文件 -> 将工作区另存为，然后保存你的工作区。VS Code会在保存成功后自动从文件夹切换到你的工作区
或者你可以按照如下步骤直接创建VS Code工作区文件：
新建文件工作区名称.code-workspace，并输入如下内容：
{ "folders": [{ "path": "你的源码目录/leon-frame-first-front" }], "settings": {} }
保存，双击并选择使用Visual Studio Code打开。
VS Code会默认保存最近一次打开的工作区。
5.为工作区配置ESLint
从菜单栏中选择文件 -> 首选项 -> 设置，切换到工作区标签页（位于搜索栏的下方），然后点击右上角的{}按钮，进入JSON文件编辑模式。
或者你可以选择直接使用文本编辑器编辑你创建的工作区文件。
在settings节中增加如下内容（此预览包含完整的code-workspace文件内容）：
{
"folders": [{
"path": "你的源码目录/leon-frame-first-front"
}],
"settings": {
"eslint.nodePath": "你的源码目录/leon-frame-first-front/leon-frame-webapp/node_modules"
}
}
