设置开发环境

使用 Online Editor 对 Weex 尝鲜是一个不错的选择，但如果你想更专业的开发 Weex，本节会教你如何搭建本地开发环境进行 Weex 开发。

安装依赖

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

首先，你需要 Node.js 和 Weex CLI。

安装 Node.js 方式多种多样，最简单的方式是在 Node.js 官网 下载可执行程序直接安装即可。

更多安装方式可参考 Node.js 官方信息

通常，安装了 Node.js 环境，npm 包管理工具也随之安装了。因此，直接使用 npm 来安装 weex-toolkit, 你也可以通过 yarn 来进行安装。

国内的开发者推荐将npm镜像切换至 Taobao NPM 镜像 https://registry.npm.taobao.org。

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

OSX环境

  1. $ sudo chmod -R 777 /usr/local/lib/node_modules/
  2. $ npm i -g weex-toolkit // 安装不要使用sudo执行
  3. $ weex -v // 查看当前weex工具版本

Windows环境

  1. $ npm i -g weex-toolkit 
  2. $ weex -v // 查看当前weex工具版本

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

初始化项目

然后初始化 Weex 项目：

  1. $ weex create awesome-project

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

开发

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

预览效果图

关于 Weex 语法部分，你可以直接参考 Vue Guide，这里不再重复介绍。如果您想了解有关技术详情的更多信息，请继续阅读下一节。