前端开发工具及插件推荐

VS Code

• 前端框架推荐使用VS Code 作为编码工具。与其他编码工具相比，VS Code 具有轻量、功能强大、插件丰富的优点。

• 下载地址：https://code.visualstudio.com
  

插件推荐

插件安装方法

• 点击菜单栏View，选择Extensions菜单项。然后在左侧的搜索框中输入插件的名称进行搜索，找到需要的插件点安装。
  

1. Chinese (Simplified) Language Pack for Visual Studio Code.

• 此中文（简体）语言包为 VS Code 提供本地化界面。安装后，在 locale.json 中添加 “locale”: “zh-cn”，即可载入中文（简体）语言包。要修改 locale.json，你可以同时按下 Ctrl+Shift+P 打开命令面板，之后输入 “config” 筛选可用命令列表，最后选择配置语言命令。可以将编译器汉化。非常适合英文不好的同学。
  

2. Vetur(vue2) or Volar(vue3)

• Vue官方插件，提供对.vue文件的支持，该插件必须安装，根据需求安装对应的。
  
  

3. ESlint

• 代码规范检查和格式化插件，根据项目需求安装，没有要求的话，不建议安装。
  

4. EditorConfig

• 编辑器配置插件，必须安装。
  

5. Chrome

• Chrome浏览器调试插件，选择性安装。
  

6. Prettier

• 代码美化/格式化插件，选择性安装。
  

7. Element UI Snippets

• Element UI库插件，使用ElementUI时建议安装。
  

8. Auto Close Tag

• 自动关闭标签插件，建议安装。
  

9. Auto Rename Tag

• 自动重命名标签插件，建议安装。
  

10. Path IntelliSense

• 路径智能提示插件，建议安装。
  

10. SCSS IntelliSense

• SCSS智能提示插件，建议安装。
  

11. stylelint

• CSS规范检查插件，选择性安装。
  

12. Visual Studio IntelliCode

• VSCODE智能提示优化插件，建议安装。
  

插件配置

1. EditorConfig 属性配置 .editorconfig

• 参考：https://editorconfig.org
  

2. ESLint 自动矫正配置 .vscode/settigns.json
   
3. ESLint 项目配置 (TS项目) .eslintrc.js
   
   
4. ESLint 项目配置 (VUE项目) .eslintrc.js