vscode上不容错过的插件

朴灿烈づ我的快乐病毒、 2022-11-10 14:52 181阅读 0赞

### 总有一款你喜欢的 ###

*   *  0）快速生成html文档
     *  1）设置为中文
     *  2）保存时自动格式化代码
     *  3）实时展示代码渲染Live Server
     *  4）识别wxml&wxss
     *  5）自动添加HTML / XML关闭标签
     *  6）自动重命名配对的HTML / XML标签
     *  7）Vue代码提示
     *  8）在浏览器观看html文件
     *  9）彩虹括号，每一对一个颜色（好区分）
     *  10）美化代码字体主题（看起来不那么方方正正的）

## 0）快速生成html文档 ##

！  
快速生成html模板。

## 1）设置为中文 ##

![你好][20210503145630899.jpg_pic_center]

--------------------

## 2）保存时自动格式化代码 ##

[【设置和使用方法】][Link 1]  
![在这里插入图片描述][20210330000557530.jpg_pic_center]

--------------------

## 3）实时展示代码渲染Live Server ##

**【实时展示代码渲染】**  
**【使用】** 在html页面右键-- >Open with Live Server  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80ODU1NzQ5Ng_size_16_color_FFFFFF_t_70_pic_center]

--------------------

## 4）识别wxml&wxss ##

【vscode本是不持支该文件类型，所以要借助该插件】  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80ODU1NzQ5Ng_size_16_color_FFFFFF_t_70_pic_center 1]

--------------------

## 5）自动添加HTML / XML关闭标签 ##

**【安装插件Auto Close Tag】**

--------------------

## 6）自动重命名配对的HTML / XML标签 ##

**【安装插件Auto Rename Tag】**

--------------------

## 7）Vue代码提示 ##

![在这里插入图片描述][20210329235913808.jpg_pic_center]

--------------------

## 8）在浏览器观看html文件 ##

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80ODU1NzQ5Ng_size_16_color_FFFFFF_t_70_pic_center 2]  
1、在默认浏览器查看  
2、在其他浏览器查看  
![在这里插入图片描述][20210416232156988.jpg_pic_center]

--------------------

## 9）彩虹括号，每一对一个颜色（好区分） ##

**【效果可以看看下面的图】**  
![在这里插入图片描述][20210503150934240.jpg_pic_center]

--------------------

## 10）美化代码字体主题（看起来不那么方方正正的） ##

![在这里插入图片描述][20210503143540546.jpg_pic_center]  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80ODU1NzQ5Ng_size_16_color_FFFFFF_t_70_pic_center 3]

--------------------

**欢迎分享你觉得不错的插件**

[20210503145630899.jpg_pic_center]: /images/20221022/ec4ee7241c7c46e8b8b279e75949b107.png
[Link 1]: https://blog.csdn.net/weixin_48557496/article/details/115314999
[20210330000557530.jpg_pic_center]: /images/20221022/834493c02a994824b4fe9ad929743314.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80ODU1NzQ5Ng_size_16_color_FFFFFF_t_70_pic_center]: https://img-blog.csdnimg.cn/20210329001045246.jpg?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80ODU1NzQ5Ng==,size_16,color_FFFFFF,t_70#pic_center
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80ODU1NzQ5Ng_size_16_color_FFFFFF_t_70_pic_center 1]: https://img-blog.csdnimg.cn/20210416231205868.jpg?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80ODU1NzQ5Ng==,size_16,color_FFFFFF,t_70#pic_center
[20210329235913808.jpg_pic_center]: https://img-blog.csdnimg.cn/20210329235913808.jpg#pic_center
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80ODU1NzQ5Ng_size_16_color_FFFFFF_t_70_pic_center 2]: https://img-blog.csdnimg.cn/20210416231909560.jpg?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80ODU1NzQ5Ng==,size_16,color_FFFFFF,t_70#pic_center
[20210416232156988.jpg_pic_center]: https://img-blog.csdnimg.cn/20210416232156988.jpg#pic_center
[20210503150934240.jpg_pic_center]: https://img-blog.csdnimg.cn/20210503150934240.jpg#pic_center
[20210503143540546.jpg_pic_center]: https://img-blog.csdnimg.cn/20210503143540546.jpg#pic_center
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80ODU1NzQ5Ng_size_16_color_FFFFFF_t_70_pic_center 3]: https://img-blog.csdnimg.cn/20210503143806373.jpg?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80ODU1NzQ5Ng==,size_16,color_FFFFFF,t_70#pic_center