微信小程序这阵子非常火,相信大家都应该已经尝过鲜了,论坛里也有很多介绍的教程,讲的都不错,而我要讲的是开发工具。

微信小程序有自己的开发工具,是基于nw.js写的。做的比较简洁,基本的代码编辑、智能提示、调试等功能都有。不好的地方也很明显,不支持查看引用,不支持代码重构,最可恶的是居然不支持自家api的智能提示,写起代码来不够畅快。

我平常都是用vscode作为开发工具,想着要让vscode支持微信小程序。于是今天抽空写了个插件。主要实现两个功能:

文件关联

微信小程序是用.wxml文件来表示页面结构,用.wxss文件来表示样式表,vscode是不能识别这两种扩展名的,因此没有语法高亮,也不能用emmet
这个插件会修改用户设置中的文件关联,将.wxml映射到.html,.wxss映射到.css,语法高亮和emmet就都搞定了。

智能提示

之前写了个脚本把官网文档里列出的api都抓了出来,生成了wx.d.ts,这个插件就是把生成的wx.d.ts丢到小程序项目目录下。然后就可以愉快地使用智能提示啦。

2016.11.11更新

微信自带开发工目前已经支持自家api提示和代码版,不过参数类型什么的提示还是没有;我这个插件已经支持实时预览,启动项目后按ctrl + f8就可以开启预览功能,后续会继续完善。

你可能感兴趣的文章

32 条评论
l_rain · 2016年11月07日

vscode党,握个抓

+1 回复

chuxue2005 · 2016年10月15日

请问可以转载吗,正在收集好文,会注明作者及出处地址;http://wxapp.dreawer.com/

回复

泡泡 作者 · 2016年10月17日

@chuxue2005 可以的

回复

少帅寇仲 · 2016年11月21日

你好,请问我使用这个插件,预览时总是提示“微信小程序预览失败,请稍后再试”,这个会是什么问题呢?谢谢

回复

泡泡 作者 · 2016年11月21日

不好意思,这几天没时间处理这个。下周有空了我瞧瞧,顺便把小程序的api升级一下

回复

少帅寇仲 · 2016年11月22日

谢谢,非常感谢,那个提示是windows版下的,换到linux版,提示变成了“command 'extension.previewWechatApp' not found”。

回复

少帅寇仲 · 2016年11月24日

你好,刚注意到插件更新到了0.04版,但是我更新后,预览还是与0.03一样的问题。谢谢

回复

泡泡 作者 · 2016年11月24日

“微信小程序预览失败,请稍后再试” 这个提示后有没有跟错误原因?

回复

少帅寇仲 · 2016年11月24日

因为提示是乱码,所以我只能截图,传到网盘,麻烦看下这个图片,谢谢。
http://pan.baidu.com/s/1hr8hoUw

回复

少帅寇仲 · 2016年11月24日

如果是linux系统,提示是这样的:http://pan.baidu.com/s/1slIo6a5

回复

少帅寇仲 · 2016年11月24日

可能需要说明一下,我的win版本是win10,linux版本是linux mint 18 cinnamon,谢谢

回复

chary · 2016年11月24日

遇到了和“ 少帅寇仲”一样的问题‘command 'extension.previewWechatApp' not found’,我的系统是win7x64 VSCode 1.7.2

回复

泡泡 作者 · 2016年11月24日

这个错误是执行node命令失败,可能是node.js没加到环境变量或者vscode的权限问题

回复

泡泡 作者 · 2016年11月24日

vscode打开的是不是小程序的项目根目录,这个插件要检测到目录下有app.json且符合小程序配置才会生效

回复

少帅寇仲 · 2016年11月24日

我的win确实没有安装nodejs,我安装了再试试,我想确认一下,这个插件支持linux系统吗?谢谢

回复

泡泡 作者 · 2016年11月24日

没在linux上测过,应该是支持的。

回复

少帅寇仲 · 2016年11月24日

谢谢,我升级一下我linux下的nodejs版本试试,因为两个系统下的错误提示不一样,linux的提示和刚才chary在win下的提示一样,但是我确实是打开的小程序根目录。

回复

0

linux 需要 wine 才能编译

chemzqm · 1月23日
少帅寇仲 · 2016年11月24日

谢谢,安装了nodejs,win下可以了,但是linux还是不行:(

回复

瞌睡虫 · 1月10日

mac 不支持吗?

回复

瞌睡虫 · 1月10日

表示我的错误跟楼上一样!previewWechatApp not found

回复

载入中...
泡泡 泡泡

1.4k 声望

发布于专栏

泡泡

php是最好的编程语言,vim是最好的编辑器

14 人关注