vscode 前端常用插件参考

vsCode插件

1. Auto Close Tag——自动添加HTML / XML关闭标签

2. Auto Rename Tag——重命名一个HTML / XML标签时，自动重命名配对的HTML / XML标签

3. Autoprefixer——自动添加css前缀，使css3兼容，操作：按F1并运行名为的命令Autoprefixer CSS。

4. Beautify——美化VS Code的代码，代码格式化（选择代码块，shift+alt+f）

5. Bracket Pair Colorizer ——可自定义的扩展名，用于为匹配的括号着色

6. Chinese——中文（简体）语言包

7. Code Runner——代码运行器，运行多种语言的代码段或代码文件,（在右上角有个播放号，能直接运行js）

8. Code Spell Checker——代码拼写检查器

9. CSS Peek——窥视CSS ID和类字符串从html文件转到相应CSS文件的定义。允许窥视和转到定义

10. Live Server——能以服务的方式启动一个html

11. Debugger for Chrome——VS代码-Chrome调试器

12. ES7 React/Redux/GraphQL/React-Native snippets——使用ES7语法在JS / TS中对React，Redux和Graphql的简单扩展

13. ESLint——ESLint 是一个代码规范和错误检查工具,将ESLint JavaScript集成到VS Code中。

14. Git History——以图表的形式查看 git 日志

15. GitLens — Git supercharged——显示文件最近的 commit 和作者，显示当前行 commit 信息

    GitLens添加到活动栏

    1. ctrl+shift+p快捷键，打开vscode命令面板，输入gitlensset
    2. 选择gitlens set views layout，点击选择Gitlens Layout
    3. 关闭vscode，重新进入
    4. 此时打开git管理的项目，就能看的Gitlens活动图标

16. HTML Snippets——代码自动填充

17. IntelliSense for CSS class names in HTML——HTML类属性的CSS类名称完成基于您的工作空间中找到的定义。它的图标解释的好

18. JavaScript (ES6) code snippets——ES6语法中的JavaScript代码段;（主要是语体）

19. JavaScript Snippet Pack——javaScript代码片段包，使您使用JavaScript的工作效率更高

20. JavaScript Snippets——VS Code的JavaScript（ES6）代码段（主要是语法）

21. Material Icon Theme——美化文件图标，让不同类型的文件分类更清晰

22. Material Theme——vsCode背景主题扩展

23. Minify——vscode缩小器,指令：按F1输入Minify压缩到当前文件夹

24. npm——(经常在默默的使用，但不知道是什么东西，好像还挺重要)

25. npm Intellisense——Visual Studio Code插件，可自动完成导入语句中的npm模块。

26. open in browser——打开html到浏览器

27. Path Intellisense——自动完成文件名的Visual Studio Code插件,路径智能

28. Split Join texts——使用分隔符分割和合并文本。操作：官网有示例

29. stylelint——详细指出显示代码错误或警告位置

30. TSLint——还是一个代码规范和错误检查工具

31. any-rule——正则提示

32. 韭菜盒子——实时查看股票基金

33. readNovel——注释的方式看小说

34. toggle Quotes——单双引号快速切换

vscode自定义代码段

"自定义名字"：{
    "prefix":"指定写入代码",
    "body":[
    	"console.log(${1})",
    	"${2:name}",//这就使可以让光标位置默认值
        "代码段书写位置",
    ],
    "description":
}

rest client，代替postman

其实没必要，毕竟postman很舒服

创建后缀html文件

# post(请求方式) 请求完整url
post http:www.baidu.com

# 请求头设置, 如
content-type: application/json

#请求参数
{
	name: '旭大王',
	age: '18',
	...
}

可以写多个，但是每个模块必须有入参，url

点击文件上的自动出现的send request进行请求测试