最近遇到一个cordova搭建的项目,于是看了看如何搭建这个。  这个其实 和 phoneGap 差不多,都是为了方便html跨平台才产生的产物。  cordova  也可以生成  iOS  和 安卓俩平台,可以使html的开发者很容易就开发出一款基本的app。 当然如果想达到跟原生app一样的效果,还需要有相当的原生功底才行。需要html与原生交互。

下面就说说如何搭建环境:

一、检查JS运行环境

打开命令行,运行以下命令 
如果不能打出版本号,需要去https://nodejs.org下载运行环境,是一个pkg,安装。

laomao:~ laomao$ npm -v
2.14.12

上面的这个安装npm有时候会被墙,要像安装pod那样  先 改变本地镜像

方法如下:

更换成淘宝的源

npm config set registry https://registry.npm.taobao.org 
– 配置后可通过下面方式来验证是否成功 
npm config get registry 
– 或npm info express

二、安装Cordova

在命令行运行以下命令,安装Cordova 
这里由于是用的sudo系统管理命令,所以需要输入系统密码。

laomao:~ laomao$ sudo npm install -g cordova@6.0
Password:
npm WARN deprecated npmconf@2.1.2: this package has been reintegrated into npm and is now out of date with respect to npm
/usr/local/bin/cordova -> /usr/local/lib/node_modules/cordova/bin/cordova
cordova@6.0.0 /usr/local/lib/node_modules/cordova
├── underscore@1.7.0
├── q@1.0.1
├── ansi@0.3.1
├── nopt@3.0.1 (abbrev@1.0.7)
├── update-notifier@0.5.0 (is-npm@1.0.0, semver-diff@2.1.0, chalk@1.1.1, string-length@1.0.1, repeating@1.1.3, configstore@1.4.0, latest-version@1.0.1)
└── cordova-lib@6.0.0 (valid-identifier@0.0.1, opener@1.4.1, properties-parser@0.2.3, semver@4.3.6, shelljs@0.3.0, cordova-app-hello-world@3.10.0, nopt@3.0.6, xcode@0.8.0, dep-graph@1.1.0, npmconf@2.1.2, aliasify@1.9.0, npm@2.14.18, request@2.47.0, tar@1.0.2, init-package-json@1.9.3, cordova-serve@1.0.0, cordova-js@4.1.3)

三、创建项目,增加平台

运行以下命令,创建一个cordova项目

laomao:~ laomao$ cordova create MyCordovaApp
Creating a new cordova project.

以iOS为例,增加iOS平台(官网的示例是浏览器的)

laomao:~ laomao$ cd MyCordovaApp/
laomao:MyCordovaApp laomao$ ls
config.xml hooks platforms plugins www
laomao:MyCordovaApp laomao$ pwd
/Users/laomao/MyCordovaApp
laomao:MyCordovaApp laomao$ cordova platform add ios
Adding ios project...
iOS project created with cordova-ios@4.0.1
Discovered plugin "cordova-plugin-whitelist" in config.xml. Installing to the project
Fetching plugin "cordova-plugin-whitelist@1" via npm
Installing "cordova-plugin-whitelist" for ios

编译代码

四、运行项目

项目目录下,有个platforms文件夹,找到对应的平台,打开项目,运行。

mac下 cordova 搭建的更多相关文章

  1. Mac下docker搭建lnmp环境 + redis + elasticsearch

    之前在windows下一直使用vagrant做开发, 团队里面也是各种开发环境,几个人也没有统一环境,各种上线都是人肉,偶尔还会有因为开发.测试.生产环境由于软件版本或者配置不一致产生的问题, 今年准 ...

  2. mac下webpagetest搭建

    我的server和agent都是在mac上搭建的,所以会和linux下有些不同   一.安装配置Apache和PHP webpagetest需要使用PHP和Apache启动服务.mac默认安装了Apa ...

  3. Mac下 cordova 安装随笔

    首先这是我自己第一篇博客,如果有什么不对的,大家指出,积极修改. cordova是大家做混合开发最经常使用的一款使用HTML, CSS & JS进行移动App开发多平台共用一套代码,中文官方网 ...

  4. mac下cordova的ios-deploy安装问题

    mac下进行cordova项目编译部署到ios设备,这个时候需要安装ios-deploy,会失败: npm WARN lifecycle ios-deploy@1.8.6~preinstall: ca ...

  5. mac下的搭建本地discuz论坛

    本地是php+mysql+apache的环境.也可以用xampp一键安装的东西,那个貌似比较省事.因为我的本地php环境已经装好了,就直接下了discuz的代码安装. 打开web共享 将discuz代 ...

  6. caffe之mac下环境搭建

    参考 http://www.linuxidc.com/Linux/2016-09/135026.html 1. 安装brew,也叫homebrew,mac下类似于ubuntu的apt-get功能 cu ...

  7. Mac下Cordova开发环境搭建

    xcode下载 从Mac App Store 下载Xcode,只需要在Store键入Xcode,下载第一个就ok了 cordova安装与配置 cordova需要node安装,使用Safari打开nod ...

  8. Mac 下Cordova开发

    一 Cordova开发环境搭建 1,安装node.js环境 官网: http://nodejs.org/  下载包安装 2,使用命令行安装 cordova 主要命令: 安装Cordova: sudo ...

  9. Mac下docker搭建lamp本地开发环境

    1.先在Mac上下载docker:官网下载:下载地址(选择mac版本下载,可能速度较慢) DaoCloud下载:下载地址(速度较快,可能版本较低) 2.装完之后打开: 3.检查一下是否下载成功: $  ...

随机推荐

  1. 如何将.NET 4.0写的Windows service和Web API部署到docker上面

    Web API. 看这篇文章: https://docs.microsoft.com/en-us/aspnet/mvc/overview/deployment/docker-aspnetmvc Win ...

  2. mac 安装 RabbitMQ

    https://blog.csdn.net/u010046908/article/details/54773323

  3. 也谈OpenStack中的虚拟机HA

    OpenStack是一个旨在为公共及私有云的建设与管理提供软件的开源项目. 它的社区拥有超过130家企业及1350位开发人员,这些机构与个人都将OpenStack作为基础设施即服务(IaaS)资源的通 ...

  4. zoj 2876 Phone List

    #include <stdio.h> #include <string.h> #include <stdlib.h> #define ZERO 0 const in ...

  5. 【高德地图Android SDK】视频教学

    前两天参加了高德在北航举办的公开课,感觉非常不错.完成老师布置的作业之后,还顺利地拿到了高德开发者认证证书!! 现在来跟大家分享一下,如何快速学习[高德地图Android SDK]的开发.一天包会!连 ...

  6. format ZKFC失败

    at org.apache.hadoop.ha.ActiveStandbyElector$WatcherWithClientRef.waitForZKConnectionEvent(ActiveSta ...

  7. [网摘][医学影像] DICOM 和 NIFTI 基础知识与区别

    查找DICOM基础知识时,看到这篇文章里面写了一些关于使用深度学习进行医疗影像分析:文件格式篇.下文摘自:https://www.jiqizhixin.com/articles/2017-07-31 ...

  8. 微信 js api[转]

    rainbow661314 微信api /**! * 微信内置浏览器的Javascript API,功能包括: * * 1.分享到微信朋友圈 * 2.分享给微信好友 * 3.分享到腾讯微博 * 4.新 ...

  9. Maven让资源文件处理插件能够解析资源文件中的Maven属性

    <build> <resources> <resource> <directory>${project.basedir}/src/main/resour ...

  10. Jquery的html方法里包含特殊字符的处理

    jqueryhtml()特殊字符 在使用jquery的html()方法时,有时候里面添加的html代码含有一些特殊字符,需要进行转义. 如下例子: inst_html = "<a st ...