Weex开发环境搭建:

第一步:安装依赖

对于Mac。可以使用Homebrew进行安装,如果没有安装Homebrew,先去官网下载Homebrew

安装成功后,在终端执行:brew install node命令

安装完成后,可以使用以下命令检测是否安装成功:

$ node -v

v6.11.3

$ npm -v

3.10.10

通常,安装了 Node.js 环境,npm 包管理工具也随之安装了。因此,直接使用 npm 来安装 weex-toolkit。

国内开发者可以考虑使用淘宝的 npm 镜像 —— cnpm 安装 weex-toolkit

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

$ cnpm install -g weex-toolkit

如果提示权限错误(permission error),使用 sudo 关键字进行安装

$ sudo cnpm install -g weex-toolkit

安装结束后你可以直接使用 weex 命令验证是否安装成功,它会显示类似以下weex 命令行工具各参数:

Weex开发环境搭建:_第1张图片

第二步:初始化

在初始化weex项目前,确保安装上了开发weex的软件,一般常用的是Webstorm,安装完Webstorm后,开始初始化Weex项目:

$ weex create 项目名称

第三步:开发

查看生成的js代码位置:

Which nginx

找到位置后,将www文件拖过去,便于查看所生成的js代码


Weex开发环境搭建:_第2张图片

打开如下之前创建的叫weex名称的weex项目


Weex开发环境搭建:_第3张图片


Weex开发环境搭建:_第4张图片

第三步:编译weex代码

例如在webstorm项目中编译src/index.vue的代码

在Terminal中执行以下代码即可:(src/index.vue为需要执行的代码    /usr/local/var/www/dist为vue生成js代码后存放的地方)

weex compile src/index.vue  /usr/local/var/www/dist

你可能感兴趣的:(Weex开发环境搭建:)