weex是什么?

Weex 是使用流行的 Web 开发体验来开发高性能原生应用的框架。
“Weex” 的发音是 /wiːks/, 和 “Weeks” 同音。
weex是阿里开源的一款类似react-native的使用js开发客户端的框架,weex可是认为是vue-native。阿里有另外一个rax框架是类似react的的框架 语法和api基本相同，也支持jsx。
weex官网：https://weex.apache.org/zh/
vue官网：https://cn.vuejs.org/
rax官网：https://alibaba.github.io/rax/

开发环境配置

Weex 官方提供了weex-cli 的脚手架工具来辅助开发和调试。
首先需要安装Node.js和Weex Cli
安装好Node.js后，就可以直接使用 npm 来安装 weex-toolkit, 你也可以通过 yarn 来进行安装。

1
npm i weex-toolkit -g

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

快速创建项目

初始化项目

然后初始化 Weex 项目：

1
2
weex create 项目名称
weex create weex-demo

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

运行项目

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

1
2
3
cd weex-demo
npm install # 这一步如果在创建项目时选择了自动安装依赖，就跳过
npm start

然后工具会启动一个本地的 web 服务，监听 8081 端口。你可以打开 http://localhost:8081 查看页面在 Web 下的渲染效果。 源代码在 src/ 目录中，你可以像一个普通的 Vue.js 项目一样来开发.
除此之外，你还可以打开 http://localhost:8081/preview.html 开启一个预览页面，它会把 web 端的页面放在一个 iframe 中渲染，而且在右侧生成一个二维码。用 Weex playground app 扫描这个二维码可以看到页面在手机上渲染的真实效果。

编译

默认情况下 weex create 命令并不初始化 iOS 和 Android 项目，你可以通过执行 weex platform add 来添加特定平台的项目。

1
2
weex platform add ios # ios
weex platform add android # android

为了能在本地机器上打开 Android 和 iOS 项目，你应该配置好客户端的开发环境。对于 iOS，你应该安装并且配置好 Xcode。对于 Android，你应该安装并且配置好 Android Studio。当开发环境准备就绪后，运行下面的命令，可以在模拟器或真实设备上启动应用：

1
2
3
weex run ios
weex run android
weex run web

调试

weex-toolkit 还提供了强大的调试功能，只需要执行：

1
weex debug

这条命令会启动一个调试服务，并且在 Chrome （目前只支持基于 V8 引擎的桌面浏览器） 中打开调试页面。详细用法请参考 weex-toolkit 的文档。