美文网首页
Weex初探--mac环境搭建

Weex初探--mac环境搭建

作者: JoeXP | 来源:发表于2017-03-23 15:50 被阅读1516次


    第一步:安装Node.js

    1. 直接官网下载,参考Node.js 官方信息

    2. 命令行,但是要先安装Homebrew 已有则直接使用brew命令安装:

    /usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"

    因网络的原因,可能会不成功,请多尝试几次,一直到成功安装.

    中间会出现一个 Press RETURN to continue or any other key to abort,请及时回车,并输入密码,不要傻等着…

    brew install node

    安装完成可以通过node -v查看是否安装成功

    node -v

    通常,安装了 Node.js 环境,npm 包管理工具也随之安装了,

    npm 是一个 JavaScript 包管理工具,它可以让开发者轻松共享和重用代码。Weex 很多依赖来自社区,同样,Weex 也将很多工具发布到社区方便开发者使用。

    npm install -g 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

    结果如下,那么就安装成功啦:

    成功安装weex

    第二步:初始化项目

    1. 修改当前终端路径到你想创建项目工程的路径下,否则默认系统 /user下

    2. 输入以下命令行,马上出现的一行新命令中,敲一个回车,应该瞬间创建完成初始化

    weex init XPWeex1

    注:XPWeex1  只是我的工程项目名称。O(∩_∩)O自由发挥

    第三步:开发

    1. 修改终端路径到项目工程下,我创建的是XPWeex1所以进入XPWeex1目录下,并依次执行

    npm install

    npm run dev

    npm run serve

    然后直接 打开浏览器,进入 http://localhost:8080/index.html 即可看到 weex h5 页面,

    AppStore下载WeexPlayground并用WeexPlayground扫描页面上行的二维码即可在手机上展示

    并且可以在终端上看到日志

    成功执行到第二行命令后,一直卡着,并且打开网址失败

    npm run dev结果

    最后我关闭了终端,在项目目录下再敲第三行命令,就能打开网址了

    其实已经说明环境搭建是成功啦。那我们紧接着就可以开始进行第一次的开发了。

    作者是一名Objiect-C开发iOS的攻城狮,平时有空喜欢研究前端开发,所以我学过好多包括:Swift、Html5、甚至Python等,后来学着学着发现,这里学了那里忘了。所以第一次尝试记录下自己的学习过程,(中间踩了好多坑,但是我是事后记录的,前面的过程歪路不记得了>_<)并帮助自己以后回顾,顺便提供一点小小的帮助给大家。

    相关文章

      网友评论

          本文标题:Weex初探--mac环境搭建

          本文链接:https://www.haomeiwen.com/subject/pxeflttx.html