微信小程序开发工具安装指南及注意事项

这两天闲来无事，也加装了 “微信卷曲”的开发工具去玩玩一下。以下就是一些小道消息及采用体验，过两天我会写下一篇文章以开发者的角度去详尽评价微信小程序:

微信小程序无法研发游戏类、直播类功能，小程序每个人高度关注的下限就是20个（还不确认，不过我坚信这就是真的，这次发布的API里并没视频组件。微信太小，苹果必须有所顾忌，但是微信也必须作出适当的妥协)

微信目前是不是同苹果商讨不好，还是个未知数，毕竟可以对AppStore存有一定的冲击。

舍弃了大量的javascript组件后，这个生态体系显得相当的半封闭，微信表述确实就是：为了更好的性能提高。那么我们拭目以待。

小程序的入口就是微信里的三级菜单，就是在“Tab栏辨认出里的游戏下面重新加入一个“小程序”。反正，这一栏里的购物和游戏我就是从来没点进来过的。

以腾讯的尿性，小程序同服务号一样，其关系链及关键功能的对外开放程度会因“人”而异。对，优质的USB只可以对外开放给腾讯的儿子们（滴滴呀、京东呀）

微信从来就是一眼相左就封禁，优步就是较好的案例。官方表述就是优步因涉嫌诱导，滴滴同样被禁过。利益面前还讲道理？反正我就是有错的。腾讯的投资全面覆盖各个行业，一旦腾讯掌控了应用领域递送入口，给儿子们一些小小的甜头，必须不是什么大事儿吧。有人说道AppStore也存有很多管制，但至少苹果并没像是腾讯这样大量的投资消费级App，轻易产生利益冲突的点并不多。话说回来，这点创业者就是不必考量的，暂时，你的产品和创意设计，在微信眼里还是个蝼蚁。。。你不必害怕受不公正的看待。如果真有一天你被微信封禁了，只要不是因为违规内容，那么你必须高兴，然后快速炒一波…….

很多搞Web的朋友尝试在小程序里写下div、ul等标签，Barneville了，没有效果，包含JQUERY在内的DOM操作方式库，小程序内就是无法运转的。小程序本质就是JS+ReactNative，对RN底层搞了重构，已经和dom说道拜拜了。

下面就是详尽的加装步骤。win10之下测试通过

以下就是加装步骤：

按操作系统浏览适当开发工具版本

windows 64十一位

windows 32十一位

mac

小程序示例组件demo浏览

双击加装

关上微信web开发者工具

嵌入一个项目，例如图

核对项目信息 特别注意AppId这里挑选“无AppId”,AppID只有公测用户才存有，无AppId在目前存有功能管制，比如说无法公布项目至手机微信中预览。

页面“嵌入项目”按钮后，将建立一个小程序项目, 工具已经为你建立了一个demo —– Hello World

开发者工具功能区域了解

工具左侧分别存有编辑、调试、项目调试区按钮，分别表述3个区域的促进作用.。

编辑： 就是你写下代码的地方，左侧的文件目录就是微信为你建立的一个项目基础骨架，你可以在这个骨架上撰写自己的业务代码。当我们撰写回去代码后，页面编辑视图左下角的“编程”即可展开调试和运转（当页面“编程后”，工具视图可以自动重定向至第二个“调试”视图）

调试: 就是你调试代码的地方。整个界面同Chrome的调试工具一模一样（必须就是嵌入了WebKit内核），坚信存有Web研发经验的同学很快就能够初学者。F8 运转至下一个断点、F10 单步运转、Ctrl+/ 注解代码。

解释一下“调试”视图下，顶部的六个Tab栏（Console、Sources、Network、Storage、AppData、Wxml）：

Console： 工具的输入区域，在程序中调用 console.log(‘测试一下console’), 可以在这里输入自定义调试信息。同时，这里也就是工具碰到异常和收到警告的信息输入区域。见到图：

Sources: 源代码表明区域，这里你可以吓到点并调试代码。Sources Pannel 用作表明当前项目的脚本文件，同浏览器研发相同，微信小程序框架可以对脚本文件展开编程的工作，所以在 Sources Pannel 中开发者看见的文件就是经过处置之后的脚本文件，同编辑区域的代码存有稍许的差异，比如说开发者的代码都会被包覆在 define 函数中，并且对于 Page 代码，在尾部可以存有 require 的主动调用。

Network: 用作观测和表明 网络的request 和 socket 的命令情况

Storage: 如果你在程序中采用了 wx.setStorage 或者 wx.setStorageSync 后，在这里将可以表明你的数据存储情况。就是的，小程序积极支持本地缓存数据。

AppData: 用作表明当前项目当前时刻 appdata 具体内容数据。可以在这里管理应用程序中的各类变量（不同于Storage中的内存变量，只有调用wx.setStorage 或者 wx.setStorageSync 的数据才可以发生在Storage中）。在这，你可以随时修正变量，工具将把变量发生改变在左侧预览视图中实时表明。我们可以看见，AppData 以页面（pages/index/index）做为分组单位，每个页面只可以表明自己的AppData，非常的准确。

Wxml：将Wxml标签同预览界面实时关联，在这里可以看见真实的页面结构以及结构对应的 wxss 属性，同时可以通过修正对应 wxss 属性，在模拟器中实时看见修正的情况。通过调试模块左上角的选择器，还可以快速找出页面中组件对应的 wxml 代码。

最后说道下“项目”这个功能区块儿， 项目实际上就是用以上载和预览项目的。微信建议所有公布的小程序都必须审查，所以须要在这里将小程序上载（必须就是类似AppStore，但确实不是AppStore的公布模式，苹果必须不能容许。小程序目前同用户的碰触方式还是未知数，而这恰恰就是最重要的一块儿）。如果你没被公测应邀，这里你就是不容以上录和预览项目的，也不可以真机运转小程序，所以真正的体验相对于原生App还是未知数。目前阶段，你就可以熟识一下小程序的API，以便在内测后快速掏出自己的产品，争抢第一波红利。

总体来说，小程序的大概研发模式和模型 已经曝露，其本质就是JS+RN，很多人说道JavaScript程序员的春天去了，其实小程序的体系和Web研发还是存有很多区别的。微信言下之意就是必须舍弃你们熟识的DOM使用他的组件体系，更熟识这种组件式研发的不是传统的Web前端，而是iOS开发人员（更早点你可以追溯到Flex和SilverLight），我本人就是不讨厌这种非JS原生的组件式研发的，自由度可以受到限制。时程，我会持续更新小程序的研发例子和教程，尽快协助大家上手研发业务和产品。你现在须要搞的，就是静心想一想，我必须研发一个什么样的产品？