VSCode 必备的开发插件
-
VSCode(Visual Studio Code)是由微软研发的一款免费、开源的跨平台文本(代码)编辑器,是目前前端开发几乎完美的软件开发工具。
文件图标 vscode-icons:VsCode中的图标插件,可以控制vscode中的文件管理的树目录显示图标。 vscode-icons,是个图标插件,和写代码没有关系,它是vscode中常用的插件之一,可以将项目中不同类型的文件或文件夹通过图标区分出来,一目了然。
暗色主题 One Dark Pro:One Dark Pro 把Atom 编辑器中流行的 “One Dark” 主题带到了 VS Code。one dark pro 是vscode 的扩展程序,one dark pro 的安装目录在 C:\Users\ 你的用户名.vscode\extensions 。我们找到这个目录 打开 zhuangtongfa.material-theme-3.0.3 发现 themes 文件夹下的 OneDark-Pro.json,猜测编辑器主题的颜色是由 里面 所控制的。
代码美化 Beautify:Beautify 插件可以快速格式化你的代码格式,让你在编写代码时杂乱的代码结构瞬间变得非常规整,代码强迫症必备,较好的代码格式在后期维护以及他人阅读时都会有很多的便利。
插件支持的语言非常多,基本堵盖了目前所有的语言,而且你还可以自定义代码格式化的结构。
代码检查工具 ESLint:ESLint 是一个语法规则和代码风格的检查工具,可以用来保证写出语法正确、风格统一的代码。
而 VSCode 中的 ESLint 插件就直接将 ESLint 的功能集成好,安装后即可使用,对于代码格式与规范的细节还可以自定义,并且一个团队可以共享同一个配置文件,这样一个团队所有人写出的代码就可以使用同一个代码规范,在代码签入前每个人可以完成自己的代码规范检查。
必备调试工具 Debugger for Chrome:此工具简直就是前端开发必备,将大大地改变你的开发与调试模式。
以往的前端调试,主要是 JavaScript 调试,你需要在 Chrome 的控制台中找到对应代码的部分,添加上断点,然后在 Chrome 的控制台中单步调试并在其中查看值的变化。
而在使用了 Debugger for Chrome 后,当代码在 Chrome 中运行后,你可以直接在 VSCode 中加上断点,点击运行后,Chrome 中的页面继续运行,执行到你在 VSCode 中添加的断点后,你可以直接在 VSCode 中进行单步调试。
西南地区IT社群(QQ)
- 云南
- 【昆明网页设计交流吧】243627302
- 【昆明nodejs交流吧】 243626749
- 【VUE】838405306
- 【云南程序员总群】343606807
- 【昆明UI设计】104031254
- 【云南软件外包】15547313
- 贵州
- 【PHP/java源码/站长交流群】55692114
- 四川
- 【成都Java/JavaWeb交流】86669225
- 【vaScript+PHP+MySql】116270060
- 【UI设计/设计交流学习群】135794928
- 重庆
- 【诺基亚 JAVA游戏博物馆】 559479780
- 【PHP,Java,Python,C++接单】 442103442
- 西藏