Vscode插件离线安装教程+中文插件安装失败解决方案

零.我的VSCode插件

Vetur
korofileheader
less  sass
chinese language
auto rename tag
auto close tag
Mithril Emmet
Debugger for Chrome
HTML CSS Support
vscode-icon
Path Intellisense
ESlint
Prettier
EditorConfig for VS Code

一.下载离线插件

官方插件网站: https://marketplace.visualstudio.com/vscode
通过搜索栏进行搜索即可.
例如搜索中文插件,点击进入到结果页后,点击 Download Extension,进行下载操作

二.插件离线安装

1.第一步:拷贝插件

将离线包放入到VsCode的Bin目录下

2.第二步:执行命令(两种方式都可以)

第一种方式: 通过命令

在命令行中输入下面的语句
code  --install-extension  xxxxxxx.vsix

出现以下语句即为成功
Extension ‘xxxxx.vsix’ was successfully installed!

第二种方式: 直接查找vsix文件

第三种方式: 直接拖入vscode

将下载好的vsix直接拖入vscode, 即可完成大部分安装, 如遇未安装成功的, 则单独安装未安装成功的插件即可!

三.中文插件安装失败解决方案

注意:请勿修改后缀为.zip等格式,不然等你修改完配置后,在改为vsix格式,会出现不识别package.json文件的问题

1.第一步:通过360压缩或其它压缩软件直接打开该vsix文件

2.第二步:修改配置文件

解释:该属性是对Vscode版本的限制
2.1: 进入到 extension 目录,打开package.json文件
2.2: 如图一,我当前Vscode版本为1.48.2,则修改package,json文件中的 engines 的vscode值为1.48.0
例如你的为1.47.2,则vscode值为1.47.0, 也就是只看大版本号, 依次类推
2.3: 修改完成后保存,然后进行 命令安装或直接查找vsix文件
图一:

图二:

四. 自用的setting.json 配置

{
  "editor.fontSize": 16,
  "editor.formatOnType": true,
  "editor.formatOnSave": true,
  "vetur.format.defaultFormatter.html": "js-beautify-html",
  "vetur.format.defaultFormatterOptions": {
    "js-beautify-html": {
      "wrap_attributes": "auto",
      
    }
  },
  "editor.codeActionsOnSave": { "source.fixAll.eslint": true },
  "files.associations": {
    "*.jsx": "javascriptreact"
  },
  //配置新建文件注释和方法注释
  "fileheader.configObj": {
    "createFileTime": true, // 设置为true则为文件新建时候作为date，否则注释生成时间为date
    "autoAdd": false, // 自动生成注释
    "annotationStr": {
      "head": "/*",
      "middle": " * @",
      "end": " */",
      "use": true // 设置自定义注释可用
    },
    "headInsertLine": {
      "php": 2
    }
  },
  "fileheader.cursorMode": {
    "description": "",
    "param ": "",
    "return": ""
  },
  "fileheader.customMade": {
    "Description": "", // 文件内容描述
    "Author": "r_yuesheng", // 编辑人
    "Date": "Do not edit", //时间
    "LastEditTime": "Do not edit",
    "LastEditors": "r_yuesheng",
  },
  // "[vue]": {
  //   "editor.defaultFormatter": "octref.vetur"
  // },
  "vetur.validation.template": false,
  "editor.fontLigatures": null,
  "[javascript]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "[json]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "[vue]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "[html]": {
    "editor.defaultFormatter": "vscode.html-language-features"
  },
  "security.workspace.trust.untrustedFiles": "open",
  "[javascriptreact]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
}

如对您产生了帮助,还望一键三连,哈哈哈!