Weex简介和环境的安装——Weex的学习之路（一）

Weex 致力于使开发者能基于通用跨平台的 Web 开发语言和开发经验，来构建 Android、iOS 和 Web 应用。简单来说，在集成了 WeexSDK 之后，你可以使用 JavaScript 语言和前端开发经验来开发移动应用。也就是说学习了Weex就可以生成三端的程序。

Weex 渲染引擎与 DSL 语法层是分开的，Weex 并不强依赖任何特定的前端框架。目前 Vue.js 和 Rax 这两个前端框架被广泛应用于 Weex 页面开发，同时 Weex 也对这两个前端框架提供了最完善的支持。Weex 的另一个主要目标是跟进流行的 Web 开发技术并将其和原生开发的技术结合，实现开发效率和运行性能的高度统一。在开发阶段，一个 Weex 页面就像开发普通网页一样；在运行时，Weex 页面又充分利用了各种操作系统的原生组件和能力。

Weex 应用需要依赖前端框架来编写，但 Weex 并没有绑定、限制在特定的框架上。目前 Vue.js 和 Rax 是最广泛应用于 Weex 开发的前端框架，也是目前功能最全、最稳定的方案。

下面我们来看看Weex开发环境的安装：

一.安装依赖

Weex 官方提供了weex-toolkit 的脚手架工具来辅助开发和调试。

首先，你需要 Node.js 和 Weex CLi。安装 Node.js 方式多种多样，最简单的方式是在 Node.js 官网 下载可执行程序直接安装即可。通常，安装了 Node.js 环境，npm 包管理工具也随之安装了。因此，直接使用 npm 来安装 weex-toolkit, 你也可以通过 yarn 来进行安装。国内的开发者推荐将npm镜像切换至 Taobao NPM 镜像。

运行下面的命令安装最新的beta版本工具：

 

npm install -g weex-toolkit@beta
weex -v // 查看当前weex工具版本

 安装结束后你可以直接使用 weex help 命令验证是否安装成功，它会显示 weex 支持的所有指令，同时，你也可以通过 weex doctor 命令检查你的本地开发环境。

二.初始化项目

初始化 Weex 项目的命令：

weex create awesome-project

 执行完命令后，在 awesome-project 目录中已经为我们生成了标准项目结构。

三.demo开发

进入项目所在路径，如果你在生成项目的时候选择了自动安装依赖，在进入项目后只需直接运行 npm start 就可以将项目完整跑起来，否则，你需要预先在项目中运行一下 npm install 安装项目所需依赖。

运行完后程序会自动在浏览器上打开一个如上的界面，这时我们就可以在手机上安装一个WeexPlayground，然后用这个App扫描上图的二维码，那么这个就是Weex项目的Hello word了。

学习Weex也有一段时间了，一直没有写博客，后续我会将我的学习经历和踩坑写在博客里供大家参考！

参考文档：

Weex的中文官方地址：https://weex.apache.org/zh/guide/introduction.html；

Weex Ui地址：https://alibaba.github.io/weex-ui/#/cn/with-weex-toolkit；

Vue.js的官方地址：https://cn.vuejs.org/v2/guide/installation.html