WX Compile key:微信小程序自动化构建编译

这是一个微信小程序的辅助工具, 作用很简单, 只是一个简单的hack, 改了一下他的源码, 把微信小程序编译的快捷键变成了全局。 快捷键默认设置为control+alt+shift+f10。(不满足?那给你弄一个gulp和webpack让你自动保存自动编译吧)

目的

其实这一个只是gulp-wx-compile的插件之一, 目的很简单, 让微信小程序变得跟webpack或者gulp一样, 当我们保存自己的代码, 小程序就自动编译, 感觉跟browser sync一样, 提高我们开发效率。

思路

以前做过游戏脚本开发,所以尝试通过窗口句柄发送ctrl+b(默认微信小程序编译快捷键)来隐式编译, 但在非激活窗口状态下可以发送单个快捷键但 无法发送组合快捷键, 这样当我们边写代码边保存的时候由于需要激活微信窗口会导致失焦的问题,所以放弃这个最简单也最优的方式。 如果有大大能解决, 欢迎给我留言。

这里选择第二种方式, 通过研读小程序的源码发现编译只是触发一个dispatch rebuild的方法(微信小程序也用到了redux)而且是基于nw.js开发的, 所以由此观察得出一个结论, 我只需要为他注册一个全局的热键并绑定dispatch rebuild即可。

安装npm i wx-compile-key -gwx-compile-key  ##这句话必须要在管理员模式下执行, 因为微信小程序的文件都是限定了修改权限的

Gulp 使用npm i wx-compile-key --save-devconst autoCompileGulpTask = require('wx-compile-key&39).autoCompileGulpTask;gulp.task(`wx:autoCompile`, autoCompileGulpTask);

Webpack Loader

(未完成测试,暂不公开)

环境

测试环境在微信Web开发者工具0.9.092300

兼容Windows

Mac/Linux代码兼容但没有测试,欢迎小伙伴测试

测试用例

由于时间关系, 只是做了e2e测试, 后续有时间会补上单元测试。 问题应该不大, 如果遇到任何问题, 请open issue,我尽可能在当天给您解答,一下是所有的e2e测试用例截图:

成功用例

当看到添加全局热键成功后可以使用ctrl+alt+shift+f10编译小程序。 例如你在自己Vscode开发的时候, 写完代码, 顺便按这个快捷键编译一下。

已添加

说明wx-compile-key的命令已经使用过。

非法路径

输入不合法路劲时,弹出一下提示, 重新输入一个合法路劲即可。

路径不存在

路径输入正确,但并非微信小程序的根目录,重新定位目录即可。

项目地址:https://github.com/jf3096/wx-compile-key