1. 程式人生 > >Ionic創建混合App(一)

Ionic創建混合App(一)

-s 空白 創建 bs項目 不能 star tool .cn 打印

最近公司要開始做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 [email protected],卸載命令 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(一)