在官网下载对应的开发版本工具微信小程序开发工具官网下载,·
注意:脱离微信开发者工具是不能调试的
好了,安装下工具即可打开,看到选择项目的界面,点击添加项目
![](https://img.haomeiwen.com/i3113151/17677ebc42c2d250.jpg)
添加项目,没有app id就选择无AppID, 勾选在当前目录中创建quick start项目,直接有个简单的示例。
![](https://img.haomeiwen.com/i3113151/634ccca9e1fea7bc.jpg)
AppID 是微信开发者官方授权开发者的一个凭证, 目前只有200家受邀内测的公众号才有,所以咱们就通过无AppID开发调试吧!主要限制如下:
![](https://img.haomeiwen.com/i3113151/b0ded243b05eebac.jpg)
然后点击添加项目即进入具体项目的开发环境
![](https://img.haomeiwen.com/i3113151/27cd86ad95d64a21.jpg)
我们先看看目前有的文件目录,点击左侧 编辑 按钮 打开所有文件目录
![](https://img.haomeiwen.com/i3113151/86b3ca0de19422c9.jpg)
注意:为了方便开发者减少配置项,微信规定描述页面的这四个文件必须具有相同的路径与文件名。这个很关键,不能随意创建目录以及文件与页面关联。
![](https://img.haomeiwen.com/i3113151/bde670d7097e98fb.jpg)
从官方文档得知 ,必须有的几项
![](https://img.haomeiwen.com/i3113151/8ce9dfa023c39cf7.jpg)
最简示例至少有一个简单的页面,所以,接下来我们删除一些文件来看最简示例的项目结构吧!
先删除多余目录以及文件剩下,如下文件,
![](https://img.haomeiwen.com/i3113151/d19c57f9333d3a95.jpg)
这时候,点击左下角的编译按钮,可以看到控制台大大的报错了,一看便知是少了logs这个目录,因为刚刚被删除了,
![](https://img.haomeiwen.com/i3113151/97f484d709e9a7e9.jpg)
那我们去 app.json配置项中找到页面配置去除多余内容吧
![](https://img.haomeiwen.com/i3113151/7b33e635e59c720b.jpg)
剩下这样的应用配置
![](https://img.haomeiwen.com/i3113151/9c3bc8b4798631eb.jpg)
点击编译,清除控制台可以看到没有报错了
![](https://img.haomeiwen.com/i3113151/d7f4885cb76e26e6.jpg)
点击编辑,打开 /pages/index/index.wxml
![](https://img.haomeiwen.com/i3113151/273cffc0a5ab77a5.jpg)
文件
改成下面这样
![](https://img.haomeiwen.com/i3113151/d9559557cd5073ab.jpg)
点击编译,ok最简示例hello weapp 完成了
![](https://img.haomeiwen.com/i3113151/ef404f6ec771c4b8.jpg)
其中wxml的写法可以看组件文档,接着尝试各种吧!
微信小程序中不能直接使用html,必须严格使用官方的组件库来开发页面显示,并且微信小程序中没有window和document对象,自然类似jquery/zepto 都是无法使用的
![](https://img.haomeiwen.com/i3113151/4ccf3bb73fc70eca.jpg)
如果要问ajax怎么办?微信自然帮我们实现了一个接口来做数据通信的事情,请看这里
![](https://img.haomeiwen.com/i3113151/7882a6bbc9e78af0.jpg)
ok 了,可以开始进一步熟悉微信小程序每一个组件和API来做应用了。
更多资源 访问Hello小程序。微信号:130870319 QQ群:40726600
网友评论