Weex开发环境搭建到Debug实战

最近公司须要，须要实现先后端隔离项目的研发。在搭建前端框架项目时，发现Weex能够实现一端开发，多端运行的特性，因此搭建研究下，算是作个技术预研。 （注：如下工具及使用的命令，均为MAC环境安装） 1、安装基本的开发环境支持工具

1. 安装Node（对于 Mac，能够使用 Homebrew 进行安装，很是简单）

brew install node

1. 安装完成后，使用以下命令检测是否安装成功

node -v
4.0.5

1. 安装weex-toolkit（注意这里使用了淘宝的 cnpm 镜像，为方便国内下载快，缘由都懂的）

npm install -g cnpm --registry=https://registry.npm.taobao.org  
cnpm install -g weex-toolkit

1. 安装结束后能够直接使用 weex 命令验证是否安装成功，下面直接开始建立项目框架

weex init your-project

1. 完成后进入your-project目录，分别输入以下命令，安装依赖和启动服务

npm install --安装依赖
npm run dev  --watch
npm run serve

1. 下面能够开始看本身的初始第一个页面了，默认目录下有一个src/foo.vue，输入以下命令，进入调试界面

weex debug your_weex.vue

会自动调用浏览器打开_http://192.168.1.10:8088/_这个网址，显示以下截图

1. 使用手机安装playground（地址_http://weex.apache.org/cn/playground.html_），在手机上打开playground，扫描上图的红色箭头指引的二维码。便可在手机端实时展示foo页面的内容，进行调试了