2016 年 09 月 21 日晚, 微信发布了 微信小程序 的内测版, 一时间整个互联网都炸了锅. 作为互联网的一猿, 我们怎能不紧跟时代的脚步, 于是第二天上午也对微信发布的 小程序 进一步的做了相关了解, 研究得出结论 这是未来
安装教程
关于使用教程网上已经有非常多的教程了, 我在这里也不过多赘述, 就简单的介绍一下, 想要快速的学习及开发微信的 小程序 ( 虽然它还没正式发布 ), 我们首先需要一个 微信web开发着工具 这么一个软件, windows 版与 Mac 版都有. 注意，是 0.9 及以上的版本, 0.7 版本无法运行.
- Mac 版本下载地址: wechat_web_devtools_0.9.092100.dmg
- Windows 版本下载地址: wechat_web_devtools_0.9.092100_x64.exe
- 微信 Web 开发者工具文档: https://mp.weixin.qq.com
Windows 直接双击安装, Mac用户直接拖进 Application 里面
先用自己的开发者账号扫一下二维码登陆 微信开 Web 发者工具, 登陆成功后会出现一下界面.
点击 添加项目 这是会提示输入 AppId、项目名称、及项目地址, 如下图
注意: 这里的 App ID 不是原来开发者帐号的那个 App ID.
众所周知, 腾讯只给发了 200 个开发者账号, 那像咱们这种没有资格的怎么办? 我们是猿诶, 在不影响他人利益的情况下当然选择破解.
注意事项
- 每个用户只能有20个
小程序. 小程序不能打开第三方应用.- 每个应用开发完后打包提交给微信进行审核.
- 应用是在微信的服务器
- 无法独立出一个独立的应用, 只能在微信上使用.
点击 添加项目 就完成了一个项目的创建.
破解方法 ( 干货 )
windows 与 Mac 的破解方法基本相同, 这里只以 Mac 为例
先关闭开发者工具下载这两个JS文件, 分别替换各个目录中的文件.
- File1: createstep.js
- File2: projectStores.js
替换路径
createstep.js => /Applications/wechatwebdevtools.app/Contents/Resources/app.nw/app/dist/components/create/createstep.js
projectStores.js => Applications/wechatwebdevtools.app/Contents/Resources/app.nw/app/dist/stroes/projectStores.js
替换完后启动应用, 然后输入 App ID (随便输入一个就行了) 然后项目名, 路径等. 这样就可以真正进入开发界面了.
按照网上的教程需要重新启动一下 微信 Web 开发者工具 原因可能是使用某些功能的时候会提示 App Id 未注册. 网上有一个微信 Demo, 也不知道是不是微信官方的, 里边有大量的例子.
Demo.zip
这是一个比较全的 Demo, 包含了大部份功能, 及微信所开放的 api.
点击关闭退出到项目选择页面, 然后选择 添加应用 与上面方法相同, 注意: 项目路径 选择刚刚所下载的 Demo 让后启动, 就可以体验大量 Demo 了.
Hello World!
文件结构
.wxml相当于 html 与 xml 的结合体..js就是 js 文件.wxss某种 css
需要注意的是目前小应用暂时不支持其他插件比如 jQuery, 选择 编辑 选项卡, 打开 /pages/index/index.wxml
是不是很熟悉, 就是 html 与 xml 的结合先不做修改, 然后打开 /pages/index/index.js
在 Page 函数里的 data 对象里的 motto 的值改成 Hello Dudulu bindViewTap 这个方法是绑定的跳转, 如果你设置了 userInfo 的 nickName 的值, 它将会显示在页面正中央, 当你点击 nickName 的时候, 它路由跳转到 /pages/logs/logs.wxml 了. 改完后回到 调式 选项卡, 点击 重启 就可以刷新刚刚所修改的文本了.
运行效果图
这里有一个错误, GitHub 上已经有修复改错误的方法了, 还需要替换一个文件: asdebug.js, 替换目录: /Applications/wechatwebdevtools.app/Contents/Resources/app.nw/app/dist/weapp/appservice/asdebug.js 就可解决以上报错的问题.
PS
已经有大神把微信的官方文档给抓取下来了, 文档地址: http://notedown.cn/weixin/component, 咱们这种破解方式显然是不行的, 我觉得微信可能会封掉这种方法, 所以大家赶紧, 我说它是未来, 这个大家自己体会, 这次我们不能再错过了!