vscodes使用(一): 常用插件,在线与离线安装
一、常用插件
1.Live server 浏览器实时刷新
插件安装成功后,会在底部工具栏中,显示个Go Live
![](https://images2018.cnblogs.com/blog/1012194/201809/1012194-20180907142432845-138925277.png)
*.html文件,点击右键,可以看到live server两条指令
![](https://images2018.cnblogs.com/blog/1012194/201809/1012194-20180907142404726-1336178514.png)
2.Esasy Sass 编译Sass
文件->首选项->设置->搜索“easysass”,将easysass相关设置复制到用户设置窗口中,根据实际情况修改。
// 文件保存后自动编译sass/scss文件 "easysass.compileAfterSave": true, // 配置正则表达式,构建时排除匹配文件;禁用为空 "easysass.excludeRegex": "", // 设置编译输出的css风格,可同时编译输出多个不同风格的css文件 // nested: 嵌套缩进;expanded:无缩进、扩展;compact:简洁;compressed:压缩 "easysass.formats": [ { "format": "expanded", "extension": ".css" }, { "format": "compressed", "extension": ".min.css" } ], // 自定义css文件输出目录 "easysass.targetDir": ""
二、在线与离线安装
- 在线安装:在vscode中,选择扩展页签,输入需要安装的扩展名称,就会出现对应的扩展列表,选择安装即可
- 离线安装:
![](https://images2018.cnblogs.com/blog/1012194/201809/1012194-20180907144843514-1378651631.png)
2.在扩展官网上,找到需求安装的扩展,点击页面中的"Download Extension",下载扩展。
下载完成后,是一个以.vsix结尾的文件,然后到vscode中扩展页签中,选择”...“,弹出扩展设置,选择”从VSIX安装“,然后重启vscode即可。
![](https://images2018.cnblogs.com/blog/1012194/201809/1012194-20180907145832229-1521574735.png)
![](https://images2018.cnblogs.com/blog/1012194/201809/1012194-20180907144834119-1214762249.png)
- 有一次微软扩展商店,服务暂停,提示"Server is 503",导致不能在线安装扩展,没办法只能copy了其他同事已安装的扩展文件
vscode扩展安装目录:C:\Users\用户名\.vscode\extensions,直接复制到对应的安装目录中,重启vscode可用。