VSCode常用插件

目录

1. VSCode 常用插件

1. Chinese(Simplified)  汉化

2.  Auto Rename Tag   

3.  One Dark Pro  颜色主题

4.  格式化代码（VS系统自带）

 5.  Open in browser 浏览器预览页面

6.  Live Server  实时预览

7.  vscode-icons  设置文件图标主题

8.  Easy LESS 编译less文件

9.  会了吧 翻译英文单词插件

10. Better Comments 区分不同注释

11. Color Highlight 显示 css 中的颜色

12. Console Ninja 代码中显示控制台打印的log

---

1. Chinese(Simplified)  汉化

        vscode下载完是英文版的，安装这个插件可以改为中文版

2.  Auto Rename Tag   

        修改开始标签 ，结束标签跟着自动变化

  

3.  One Dark Pro  颜色主题

        可以修改颜色主题

4.  格式化代码（VS系统自带）

        这个设置可以在保存时自动格式化你写的格式不齐的代码，步骤为:

        设置—>文本编辑器—>格式化—>勾选 Format On Paste 和 Format On Save

 5.  Open in browser 浏览器预览页面

        编写完代码，用这个插件可以在浏览器中预览，鼠标右键Open In Default Browser(用默认浏览器预览)，Open In Other Browsers(用其他浏览器预览)。

6.  Live Server  实时预览

        这个插件可以在我们修改完代码后自动更新修改代码后的浏览器页面，不需要手动刷新浏览器，有个需要注意的点，要想这个插件起效果，必须先用vscode打开文件所在的文件夹。

7.  vscode-icons  设置文件图标主题

        这个插件可以显示文件对应的图标，如 html 文件显示html的图标，css文件显示css的图标

8.  Easy LESS 编译less文件

        less文件不能直接引入到html文件中，需要转化成css文件，这个插件可以帮我们自动生成css文件。

9.  会了吧 翻译英文单词插件

        我们看到的代码中往往有些单词看不懂，这个插件可以翻译英文单词，点击单词还会有读音

10. Better Comments 区分不同注释

且支持自定义样式，如下：

11. Color Highlight 显示 css 中的颜色

css 中设置的什么颜色可以直观地显示出来

12. Console Ninja 代码中显示控制台打印的log

控制台中打印的log可以显示在对应代码的后面，方便区分是哪句代码的log，鼠标移到代码上就可以看到控制台的打印

困了，剩下的下次再更新