img-wh

安装

• 安装 链接内点击install即可安装https://marketplace.visualstudio.com/items?itemName=lihaoming.img-wh 也在vscode插件市场可以搜索img-wh安装

功能说明

• 快速计算好图片尺寸并根据模板返回图片的尺寸、相对路径、最后一级路径
• 支持自定义生成的代码模板
• 支持配置路径来指定需要的图片

使用方法

按下快捷键选择图片即可生成代码片段（注意，默认只显示在src项目下的图片）

• windows：按ctrl+4
• mac：按cmd+4

自定义配置项教程

在插件的设置可以配置生成的代码模板和过滤不需要的图片

配置快捷键

默认为windows：按ctrl+4 mac：按cmd+4，需要修改的在vscode的键盘快捷方式中直接搜索img-wh然后修改快捷键即可

配置生成的代码模板

默认为a-img组件的生成代码，也可以自定义生成 width和height为图片的宽和高，src为图片地址，shortImg为图片地址的最后一级路径,className为文件名

    "img-wh.tpl": "<a-img class="${className}" w="${width}" h="${height}" src="${shortImg}"/>"  

配置路径过滤不需要的图片

<!-- opthon -->
    "img-wh.path": ["src/assets/**/*.{png,jpg,gif}"]