一、前言
微信关注的公众号推送了几篇Weex的文章,借此机会了解下Weex,在这里记录下学习的历程。
二、Weex简介
Weex是阿里巴巴在2016年6月份对外开源的一款移动端跨平台的移动开发工具,是一套简单易用的跨平台开发方案,能以 web 的开发体验构建高性能、可扩展的 native 应用,为了做到这些,Weex 与 Vue 合作,使用 Vue 作为上层框架,并遵循 W3C 标准实现了统一的 JSEngine 和 DOM API,这样一来,我们甚至可以使用其他框架驱动 Weex,打造三端一致的 native 应用。
Weex的出现让我们的应用既有了Native的性能和H5的动态性,只要通过前端JS语法就能写出同时兼容iOS、Android、Web三端兼容的页面,解决了移动应用开发中频繁发版和多端研发等痛点。
相对于Facebook的React Native,Weex更加轻量、接入成本更小、更容易上手。而且Weex的理念(write once, run everywhere)相比于React Native的理念(Learn once, write anywhere)更加的让人感觉NB,Weex的底层framework磨平了上层调用的差异。
Weex更多细节参考: http://alibaba.github.io/weex/index.html。
三、Weex开发环境搭建
1、安装Node环境
1.0、安装Homebrew
Homebrew是Mac OSX上的软件包管理工具,能够在Mac中方便的安装和卸载软件。后面会采用Homebrew安装Node环境。
打开终端,输入以下命令:
HTdeMacBook-Pro:~ CHT$ brew
如出现以下情况说明mac未安装Homebrew:
-bash: /usr/local/bin/brew: No such file or directory
安装方法,输入以下命令:
/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
稍等片刻,等待安装完成。安装失败或长时间没反应,可尝试翻墙解决。
检查是否安装成功:
HTdeMacBook-Pro:~ CHT$ brew --version
若安装成功,显示如下:
Homebrew 1.1.6
1.1、安装Node和npm
Node是Weex代码构建中的必要依赖,Weex需要Node4.0以上的环境。
npm(node package manager)是nodejs的包管理器,用于Node插件管理(包括安装、卸载、管理依赖等),安装Node的同时会安装好npm。
安装方式:打开终端,输入以下命令:
HTdeMacBook-Pro:~ CHT$ brew install node
稍等片刻,等待安装完成。安装失败或长时间没反应,可尝试翻墙。
安装完成或可通过以下命令验证是否安装成功:
HTdeMacBook-Pro:~ CHT$ node -v
v7.4.0
HTdeMacBook-Pro:~ CHT$ npm -v
4.0.5
2、安装weed-toolkit
使用上面安装完成的npm进行安装,安装命令如下:
HTdeMacBook-Pro:~ CHT$ npm install -g weex-toolkit
笔者在这一步卡住了很久没有反应,后来尝试将npm更换到国内淘宝镜像,问题解决。
安装命令如下:
HTdeMacBook-Pro:~ CHT$ npm install cnpm -g --registry=https://registry.npm.taobao.org
不出意外的话,这次不会卡住。耐心等待安装完成,可通过以下命令检查是否安装成功:
HTdeMacBook-Pro:~ CHT$ cnpm -v
4.4.2
cnpm与npm用法相同,只需把所有命令的“npm”换为“cnpm”即可。
使用cnpm安装weed-toolkit,安装命令如下:
HTdeMacBook-Pro:~ CHT$ cnpm install -g weex-toolkit
安装完成后,可通过以下命令验证:
HTdeMacBook-Pro:~ CHT$ weex --version
info 0.6.4
到这里,说明安装成功!
有任何问题,欢迎留言一起讨论。