首页 > 代码库 > Ionic创建混合App(一)

Ionic创建混合App(一)

最近公司要开始做App项目,最终选定了ionic开发方案,在这里我将学习的过程记录在这里,一方面避免自己忘记,另一方面方便大家交流学习。

一、环境搭建

  首先还是开发环境的搭建,这里我只说andorid环境的搭建,ios之后再说。

  1.java JDK安装(建议安装新版)

    下载地址一:http://www.oracle.com/technetwork/java/javase/downloads/index.html

    下载地址二: http://www.androiddevtools.cn/

    下载地址三: http://jdk.android-studio.org/

    具体的安装步骤可以百度搜索,安装完成收到 ”运行->cdm->java/javac“能打印用法说明证明安装成功。

 

  2.nodejs 安装

    下载地址:https://nodejs.org/en

  3.cordova 安装

    npm set registry https://registry.npm.taobao.org # 注册模块镜像
    npm set disturl https://npm.taobao.org/dist # node-gyp 编译依赖的 node 源码镜像
    npm cache clean # 清空缓存

    在国内因为 goolge不能使用的问题,所以我们一般才用淘宝镜像安装,使用cnpm替代npm  

    命令行运行 

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

    然后使用官方的安装方法安装,在之前的cordova2.9还能下载安装包安装,现在官方给的安装方法只能在线安装,如果要选择安装版本可以使用 cnpm install -g cordova@version,卸载命令 npm uninstall cordova -g

cnpm install -g cordova

    完成后使用cordova -v能查看版本证明安装成功

  4.ionic 安装

    如果已经安装可以使用更新命令更新 cnpm update -g ionic  

cnpm install -g ionic

    完成后使用ionic -v能查看版本证明安装成功

 

二:创建ionic项目

  环境都安装成功了以后现在就可以创建 ionic项目了

  Ionic提供了三种初始模版,即:tabs、sidemenu、blank,不加模版名时默认创建tabs项目。

    ionic start myApp --v2 tabs //使用tabs模版创建Ionic2项目
    ionic start myApp --v2 sidemenu //使用sidemenu模版创建Ionic2项目
    ionic start myApp --v2 blank //创建空白的Ionic2项目

  1.ionic -v1项目
//创建ionic -v1版本的项目
ionic start demo --v1 --skip-npm 
cnpm install --save 
ionic serve 

  这样我们就可以看到我们创建的ionic -v1版本的项目了 http://www.cnblogs.com/jinxiblog/p/6820659.html

  2.ionic -v2项目

//创建ionic -v2版本的项目
ionic start demo --v2 --skip-npm 
cnpm install --save 
ionic serve 

  ionic项目创建报错处理 http://www.jianshu.com/p/f9b0dfe35328

 

Ionic创建混合App(一)