vscodes使用(一): 常用插件,在线与离线安装

时间:2023-03-09 16:07:42
vscodes使用(一): 常用插件,在线与离线安装
一、常用插件
1.Live server 浏览器实时刷新
vscodes使用(一): 常用插件,在线与离线安装
插件安装成功后,会在底部工具栏中,显示个Go Live
vscodes使用(一): 常用插件,在线与离线安装
vscodes使用(一): 常用插件,在线与离线安装
*.html文件,点击右键,可以看到live server两条指令
 vscodes使用(一): 常用插件,在线与离线安装
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中,选择扩展页签,输入需要安装的扩展名称,就会出现对应的扩展列表,选择安装即可
  • 离线安装:
   1.插件官网地址:https://marketplace.visualstudio.com/vscode
 vscodes使用(一): 常用插件,在线与离线安装

   2.在扩展官网上,找到需求安装的扩展,点击页面中的"Download Extension",下载扩展。

   下载完成后,是一个以.vsix结尾的文件,然后到vscode中扩展页签中,选择”...“,弹出扩展设置,选择”从VSIX安装“,然后重启vscode即可。

 vscodes使用(一): 常用插件,在线与离线安装
vscodes使用(一): 常用插件,在线与离线安装
  • 有一次微软扩展商店,服务暂停,提示"Server is 503",导致不能在线安装扩展,没办法只能copy了其他同事已安装的扩展文件

      vscode扩展安装目录:C:\Users\用户名\.vscode\extensions,直接复制到对应的安装目录中,重启vscode可用。