week-搭建开发环境

• 对于 Mac，可以使用 Homebrew 进行安装node：

 brew install node

• 安装了 Node.js 环境，npm 包管理工具也随之安装了

• 然后检测版本号（可以查看Node.js 官方信息）

$ node -v
v6.11.3
$ npm -v
3.10.10

6F0AD026-9846-49B3-935C-9B3EBB12631A.png

• 然后用nmp的安装weex-toolkit 发现cnpm也未安装(如上图)

- npm install -g cnpm --registry=https://registry.npm.taobao.org --verbose
但是mac 一定要加`sudo`，不然会报一下错误

686FCF5A-DA73-4743-8231-22542DCBCD80.png

• 安装cnpm完成如图
  

  FD2B1E4B-39AB-45BC-9A43-409F078C89D0.png

• 安装weex-toolkit

$ sudo cnpm install -g weex-toolkit

71E71606-D199-41A7-B87E-9C044F60D264.png

• weexpack 是新一代的weex应用工程和插件工程开发套件，是基于weex快速搭建应用原型的利器。可以创建weex应用工程和插件工程，快速打包 weex 应用并安装到手机运行，还可以创建weex插件模版并发布插件到weex应用市场。 使用weexpack 能够方便的在在weex工程和native工程中安装插件。

stdo admin$ cnpm install -g weexpack

weexpack

weexpack 是新一代的weex应用工程和插件工程开发套件，是基于weex快速搭建应用原型的利器。可以创建weex应用工程和插件工程，快速打包 weex 应用并安装到手机运行，还可以创建weex插件模版并发布插件到weex应用市场。 使用weexpack 能够方便的在在weex工程和native工程中安装插件。

$ npm install -g weexpack

准备工程

创建工程

$ weexpack create appName

生成工程的目录如下：

WeexProject 
├── README.md 
├── android.config.json 
├── config.xml 
├── hooks 
│   └── README.md 
├── ios.config.json 
├── package.json 
├── platforms // 平台模版目录 
├── plugins // 插件下载目录 
│   └── README.md 
├── src // 业务代码（we文件）目录
│   └── index.we 
├── start 
├── start.bat 
├── tools 
│   └── webpack.config.plugin.js 
├── web 
│   ├── index.html 
│   ├── index.js 
│   └── js 
│   └── init.js 
└── webpack.config.js

通过 create 命令创建的工程默认不包含 ios 和 android 工程模版，创建完成之后就可以切换到appName目录下并安装依赖。

$ cd appName && npm install

安装 weex 应用模版

添加应用模版，官方提供的模版默认支持 weex bundle 调试和插件机制，注意模版名称均为小写，模版被安装到platforms目录下。
IOS

  $ weexpack platform add ios

Android

  $ weexpack platform add android

安装模版之后，会在工程目录下增加如下模版目录

WeexProject 
├── platforms 
│   ├── ios
│   └── android

• build: 源码打包，生成 JS Bundle
• dev: webpack watch 模式，方便开发
• serve: 开启HotReload服务器，代码改动的将会实时同步到网页中

我们先通过 npm install 安装项目依赖。
之后运行根目录下的 npm run dev & npm run serve 开启 watch 模式和静态服务器。

参考：

• https://www.jianshu.com/p/084b5b1e7ffe?from=timeline
• https://blog.csdn.net/w815878564/article/details/73557505
• http://weex.apache.org/cn/guide/set-up-env.html