工欲善其事,必先利其器。
➢ 基础插件
编辑器的上手配置
1.Chinese Language Pack for Visual Stidio Code
适用于VS Code的中文(简体)语言包 新手建议先用中文熟悉,以后上手英文界面也不迟
2.open-in-browser
右键一件选择
在默认浏览器中打开当前页面
➢ 界面美化
好的代码始于颜值
1.vscode-icons
文件格式一目了然
左侧文件目录的文件夹和文件都会显示相应的图标
2.Prettier-code formatter
代码格式化
主要作用于JavaScript/TypeScript/Css
3.Beautify
代码格式化
主要作用于JavaScript/Json/Css/Sass/Html
➢ 视觉辅助
色彩选择和图片展示
1.SVG Viewer
无需离开编辑器就可以打开SVG
文件并查看它们
同时还包含了用于转换为PNG
格式和生成数据URL模式的选项
2.Color Picker
拾色器
直接在编辑器中选择合适的颜色
3.Vetur
vue
语法高亮/格式化/代码片段/语法检查等
4.语法高亮
直接搜索对应的语言名称即可 比如Html/Css/Es6/Sass/TypeScript/React
等
➢ 智能补全
智能提示、补全、修正
1.Css Peek
右键单击选择器时,展示当前样式,可直接跳转到定义css
的代码位置
2.Auto Close Tag
自动闭合Html/Xml
标签
3.Auto Rename Tag
自动完成另一侧标签的同步修改
4.Path Intellisense
自动提示文件路径,支持快速引入文件
➢ 版本控制
1.GitLens
git
版本控制
2.Git Histroy
Git
的详细信息和图表
3.SVN
SVN
版本控制
➢程序调试
debugger
1.Debugger for Chrome
在编辑器中设置断点等调试,用于Chrome
2.Quokka.js
实时调试和展示
➢ 代码检测
协同工作和代码质量
1.ESlint
将ESlint
集成到vscode
中
2.npm
根据package.json
定义的依赖验证已安装的模块
➢ 云端同步
一周24小时
在线
1.Settings Sync
使用Github Gist
同步多台计算机上的设置,代码段,主题,文件图标