vs code插件。用法。

1、emmit：极速创建网页代码记住以下4个点即可

“!”或“html:5”  创建html基本框架
-----------------------------------------
设置id、class、属性、文本
.idName
#className
[propName=123]
{text}
-----------------------------------------
后代，兄弟、分组、重复
div>span
div+span
(div>div)+span
((div>div)+span)*5
-----------------------------------------
创建随机文本，可以用于测试排版
lorem   默认生成30个英文词
lorem2  后面可以带数字，表示生成多少个词

2、vs code快捷键

打开命令窗口：f1
全局搜索：ctrl+shift+f
搜索：ctrl+f
选中某一行：home或者end，鼠标光标移动到行首、行尾。shift+home可以选择到行首...
多行输入：ctrl+alt+↑或↓

3、Beautify 格式化代码让代码工整整齐

快捷键：shift+alt+f

4.CSS Support 让 html 标签上写class 智能提示当前项目所支持的样式

默认：<div class="|">此时，旁边不会提示外部及本页面样式可用的样式

4.Path Autocomplete自动路径补全

5. Document This：JSDOC注解调用，值得易用

使用：鼠标在function那一行双击两次：ctrl+alt+d

技巧：
/**
 *
 *
 * @param {*} x
 * @param {*} r
 */
规范写法：
/**
 *这里写函数的用途
 *
 * @param {string这里写变量类型}x(可选/必须。这里是变量的描述)
 * @param {boolen} r
 */

6.Auto Close Tag：标签写完开始标签，会自动添加闭合标签

7.Auto Rename Tag:修改一边的标签，另一边会自动同步

8.### Bracket Pair Colorizer 区分代码块

9.Quokka.js调试代码很有用

相当于会自动node ...执行

使用方法：打开命令面板，选择Quokka.js
再选择，new javascript或typescript file
也可以看旁边有快捷键：ctrl+k ,按完再按j

10.### vscode-icons Icon 集合，美化目录

打开命令面板，输入icons，可以选择更多的功能

11.浏览器查看

1.下载live-server npm，手动全局安装，然后cmd命令执行
2.安装Open-In-Browser

12..CSS Peek html中，查看样式的具体内容

使用技巧：鼠标右键，查看定义或转到定义
也可以使用快捷键，f12和alt+f12

13.Color Info

鼠标放在颜色上面，会弹框可以可视修改颜色。最右边是最开始的颜色，点击可恢复

14.Image Preview鼠标移在路径上面，直接可以看到图片及宽高大小

15.carbon-now-sh 代码截图，高清

快捷键：alt+win+a

16.GitLens git

17.json tools对json数据，一行还是规格化展示

选择文本，打开命名面板，选择json。。。

18.filesize显示文件信息

安装之后，在编辑器左下角，会出现，34kb
即文件的大小，点击该区域，可以看到该文件更多的信息

19.Code Runner 代码调试

20.Autoprefixer css兼容自动补全

21.