首页 > 技术文章 > vscodes使用(一): 常用插件,在线与离线安装

yuxina 2018-09-07 15:10 原文

一、常用插件
1.Live server 浏览器实时刷新
插件安装成功后,会在底部工具栏中,显示个Go Live
*.html文件,点击右键,可以看到live server两条指令
 

 

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
 

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

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

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

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

推荐阅读