image-link-preview

图片预览插件

图片地址支持 http/https、 data:image/...;base64,... 以及本地图片 './common/nav.png' 以及本地图片 '@/static/image/nav.png' 本地别名路径会优先按项目 tsconfig.json / jsconfig.json 的 paths 配置解析，支持 @/* 和 @。

npm run package
npm run publish

在vscode中安装插件
在vscode中打开用户配置文件，添加以下配置：

{
  "imagePreview": {
    "enabled": true,
    "width": "120",
    "extensions": ["jpeg", "jpg", "png", "gif", "webp", "svg", "bmp"],
    "gutterEnabled": true,
    "gutterIconSize": "contain",
    "gutterRefreshDelay": 20
  }
}

配置项说明：

imagePreview.enabled：是否开启图片预览功能
imagePreview.width：鼠标悬浮预览时的图片宽度
imagePreview.extensions：识别为图片预览的后缀列表 ['jpeg', 'jpg', 'png', 'gif', 'webp', 'svg', 'bmp']
imagePreview.gutterEnabled：是否在编辑器左侧显示图片缩略图
imagePreview.gutterIconSize：左侧缩略图大小，支持 contain、cover、auto 或百分比
imagePreview.gutterRefreshDelay：左侧缩略图刷新节流时间，单位毫秒

刘凯

图片预览插件