【源码】基于VSCode的小程序开发辅助插件

项目简介

本项目是一款基于VSCode的小程序开发辅助插件，为开发者提供了一系列实用功能，帮助提高小程序开发效率，解决开发过程中的一些提示和补全问题。

项目的主要特性和功能

1. 新增功能：支持wxml变量补全、属性提示、Bind事件名补全、Template wxml中相关提示，修复Props部分情况下无提示问题。
2. 一键创建组件：右键选择 New Miniprogram Component，输入组件名可一键创建 .wxml/.js/.wxss/.json 及组件文件夹，并自动打开 js 文件，支持配置css/wxml/js后缀。
3. 自动补全：涵盖标签名与属性、属性值、自定义组件、样式名、内置snippets等自动补全，在vue模板文件和pug语言中也可使用。
4. 智能筛选属性：根据组件已有属性，自动筛选对应支持的属性集合。
5. 跳转功能：在纯wxml或pug文件中，点击模板文件中的函数或属性可跳转到js/ts定义处。
6. 高亮功能：纯wxml或pug文件中，js变量可高亮，支持配置高亮开关、颜色和范围。
7. 其他功能：支持link、emmet写法、wxml格式化（支持 prettyHtml, js-beautify 和 prettier）。

安装使用步骤

安装

假设用户已下载本项目源码文件，将其放置到VSCode的插件目录下，重启VSCode即可完成安装。

使用

1. 一键创建小程序组件：在项目中右键，选 New Miniprogram Component，输入组件名，按需配置后缀。
2. 自动补全：wxml中输入 < 触发标签补全，输入空格触发属性补全；属性值中输入空格触发属性值补全。
3. 跳转功能：纯wxml或pug文件中，点击函数或属性尝试跳转。
4. 样式名补全：系统自动获取同名样式文件样式名，可指定全局样式文件和后缀。
5. vue模板文件支持：vue的template标签中设置 lang 和 minapp 属性实现自动补全。
6. link功能：默认link src标签，可扩展支持标签和使用相对目录解析图片路径。
7. 高亮功能：通过相关配置项配置高亮参数。
8. 内置snippets：可直接使用或自定义。
9. emmet写法：编辑中直接使用提高效率。
10. wxml格式化：指定格式化工具并按需配置参数。

常见问题解决

1. 安装插件后没有出现自动补全：确保安装后重启VSCode，且当前文件格式是wxml、wxml - pug或vue。
2. 在非小程序项目，pug文件不想要小程序的自动补全：非小程序项目将.pug后缀文件关联到 pug 文件类型；小程序项目关联到 wxml - pug 文件类型。

下载地址

点击下载 【提取码: 4003】【解压密码: www.makuang.net】