黑马程序员pink老师前端入门教程，零基础必看的h5(html5)+css3+移动端前端视频教程-p11-10-vscode插件使用-视频笔记

视频地址:https://www.bilibili.com/video/BV14J4114768?p=11&spm_id_from=pageDriver&vd_source=92091721fde667b87f2021fd2256a257

使用vscode的原因

• 插件相当好用

插件的安装

• 点击vscode左边的插件按钮(鼠标移动到按钮上会出现提示:扩展,位于从上到下的第五个按钮,当然前提是你没有安装过别的插件)
• 点了之后,上面会出现一个搜索框,需要什么插件都可以在该搜索框中搜索,搜索框下面就会出现相关的插件
• 搜索出需要的插件后,点击该插件→再点击右边的install按钮安装插件(也要可能是中文:安装二字)
• 安装完成后,按钮会变成Uninstall或者是卸载二字

中文插件[Chinese (Simplified) (简体中文) Lang]的安装

• 第一次打开时,页面会优先显示英文
• 点击左边中间有四个小正方形的图标

图1中红色框起来的就是插件按钮,不同版本按钮图标可能会不同,但位置基本不变

图1

• 在搜索框中搜索:简体中文
• 出来的选项中有一个是:Chinese (Simplified) (简体中文) Lang
• 点击该选项→再点击右边的Install按钮安装
• 安装好后,该按钮会变成Uninstall,要卸载的话就点击该按钮
• 退出重启vscode

推荐安装的插件

• open in browser:右键选择浏览器打开html文件
• js-css-html formatter:每次保存,都会自动格式化js css和html代码
• auto rename tag:自动重命名配对html/xml标签
• css peek:追踪至样式

插件的安装总结

• 先点击左边插件按钮
• 在出来的搜索框中输入插件名字
• 找到需要的插件后,点击安装
• 注意:有一些插件时需要重启vscode才能生效