Miniprogram for Visual Studio Code
小程序代码提示插件(同时支持6种小程序类型)，跨平台，可以在 "设置->小程序" 中任意切换环境。
Features 特性
- Syntax-highlighting
- 代码高亮
- Snippet
- 代码片断
- Emmet
- 代码提示
- Linting / Error Checking
- Formatting
- 代码格式化
- Auto Completion
- 自动补全
This extension adds WeChat Snippets into Visual Studio Code.
这个插件基于最新的微信小程序 API 添加了Code Snippets。
It looks like:
Snippets
Including most of the API of WeChat. You can type w, choose wx:if, and press ENTER, then wx:if="" appear on the screen.
插件的 Snippets 如下表格所示，比如你可以键入 w 然后按上下键选中 wx:if 再按Enter键，就输入了wx:if=""了。
| Prefix |
directives Snippet Content |
wx:if |
wx:if="" |
wx:else |
wx:else |
wx:elif |
wx:elif="" |
wx:for |
wx:for="" |
wx:for-item |
wx:for-item="" |
wx:for-index |
wx:for-index="" |
wx:key |
wx:key="" |
| Prefix |
HTML Snippet Content |
coverImage |
<cover-image></cover-image> |
coverView |
<cover-view></cover-view> |
matchMedia |
<match-media></match-media> |
movableArea |
<movable-area></movable-area |
movableView |
<movable-view></movable-view |
scrollView |
<scroll-view></scroll-view |
swiper |
<swiper></swiper> |
swiperItem |
<swiper-item></swiper-item> |
view |
<view></view> |
icon |
<icon></icon> |
progress |
<progress></progress> |
richText |
<rich-text></rich-text> |
text |
<text></text> |
button |
<button></button> |
checkbox |
<checkbox></checkbox> |
checkboxGroup |
<checkbox-group></checkbox-group> |
editor |
<editor></editor> |
form |
<form></form> |
input |
<input></input> |
label |
<label></label> |
picker |
<picker></picker> |
pickerView |
<picker-view></picker-view> |
pickerViewColumn |
<picker-view-column></picker-view-column> |
radio |
<radio></radio> |
radio-group |
<radio-group></radio-group> |
slider |
<slider></slider> |
switch |
<switch></switch> |
functionalPageNavigator |
<functional-page-navigator></functional-page-navigator> |
navigator |
<navigator></navigator> |
audio |
<audio></audio> |
camera |
<camera></camera> |
image |
<image></image> |
livePlayer |
<live-player></live-player> |
livePusher |
<live-pusher></live-pusher> |
video |
<video></video> |
voip-room |
<voip-room></voip-room> |
map |
<map></map> |
canvas |
<canvas></canvas> |
ad |
<ad></ad> |
officialAccount |
<official-account></official-account> |
openData |
<open-data></open-data> |
webView |
<web-view></web-view> |
navigationBar" |
<navigation-bar"></navigation-bar"> |
pageMeta |
<page-meta></page-meta> |
progress |
<progress></progress> |
pages |
pages: [] |
Supported languages 支持6种
- wxml(.wxml)微信小程序
- axml(.axml)支付宝小程序
- qml(.qml)QQ小程序
- ttml(.ttml)头条小程序
- jxml(.jxml)京东小程序
- swan(.swan)百度小程序
- ksml(.ksml)快手小程序
1、微信小程序的JS由 npm 提供支持，所以在微信环境下需要安装此依赖。官网
npm i --save-dev wx-apis
2、支付宝小程序的JS由 npm 提供支持，所以在支付宝环境下需要安装此依赖。官网
npm i --save-dev my-apis
3、QQ小程序的JS由 npm 提供支持，所以在QQ环境下需要安装此依赖。官网
npm i --save-dev qq-apis
4、头条小程序的JS由 npm 提供支持，所以在头条环境下需要安装此依赖。官网
npm i --save-dev tt-apis
5、京东小程序的JS由 npm 提供支持，所以在京东环境下需要安装此依赖。官网
npm i --save-dev jd-apis
6、百度小程序的JS由 npm 提供支持，所以在百度环境下需要安装此依赖。官网
npm i --save-dev swan-apis
6、快手小程序的JS由 npm 提供支持，所以在快手环境下需要安装此依赖。官网
npm i --save-dev ks-miniprogram-types
1.如果只安装插件没有安装对应的依赖是无法实现JS语法提示的！2.如果你需要 Tailwind CSS 开发小程序，那么你需要在设置的 Incclude Languages 中添加 项:xml-值:html 配置。
Issues
Submit the issues if you find any bug or have any suggestion.
如果你发现任何bug或者有任何建议可以提交issues或扫描下方二维码进行反馈
Contribution
Fork the repo and submit pull requests.
如果你还在寻找一款好用的跨端框架，那么推荐你使用 Mpx.
2024/07/12 (1.0.9)
2024/07/08 (1.0.8)
2024/06/30 (1.0.7)
