windows下安裝配置

npm install -g ionic?
npm install -g cordova?
ionic start myproject?
cd myproject?
ionic platform add?Android?
ionic build android?
ionic emulate android?
(build emulate可合并執行： ionic run android )

mac下安裝配置

準備工作

安裝 xcode及命令行工具?
Xcode -> Preferences -> Downloads -> Command Line Tools

要安裝Git、安裝nodejs?
如果安裝了ruby，可以使用brew安裝 nodejs

brew install node?
npm install -g cordova ionic gulp gulp視情況選擇是否安裝?
npm install?iOS-sim?
ionic start myApp sidemenu?
ionic platform add ios # Add the ios platform to project?
ionic build ios # Compile the ios code?
ionic emulate ios # Launch the app on an ios Simulator?
ionic run ios # Launch on device*?
注意不能使用sudo ionic run ios，切記。?
如果出現錯誤：

Failed to fetch platform ios Probably this is either a connection problem,or platform spec is incorrect. Check your connection and platform name/version/URL. Error:EPERM,utime '/Users/name/.cordova/lib/npm_cache/cordova-ios/3.9.2/package.npmignore'

• 1
• 2
• 3
• 4
• 5

• 1
• 2
• 3
• 4
• 5

則運行這個命令：

rm -rf ~/.cordova?
刪除 緩存。

項目創建完，會提示是否需要創建一個ionic賬號，用來推送消息。

使用chrome調試

運行命令啟動ionic服務端：

ionic serve?
按提示選擇一個網絡設備。

可以看到提示信息：?
http://192.168.2.102:8100?使用Chrome訪問這個地址，就可以使用瀏覽器查看當前程序了。

?
提示那個黃條的時候，要刷新一次瀏覽器。

在瀏覽器輸入：

chrome://inspect?
可以在這里定義開發機器與手機的端口轉發等。

安裝ngCordova

ngCordova是在CordovaAPI基礎上封裝了一系列開源的AngularJS服務和擴展。

首先要安裝brow，用來管理前端資源的依賴

通過cd 命令，把當前路徑設置到ionic/www/lib下

npm install bower -g?
bower install ngCordova

路徑看起來是這樣的：?
?
代碼可以引用這里的angular替代/lib/ionic下的angular。?
在index.html加下ngCordova的引用：

<script src="lib/bower_components/ngCordova/dist/ng-cordova.js"></script>

• 1

• 1

它是這樣引用的：

var mainApp=angular.module('mainApp',['ionic','ngCordova']);

• 1

• 1

常用命令

$ ionic build <PLATFORM> $ ionic emulate <PLATFORM> $ ionic run <PLATFORM> $ ionic run android --livereload -c -s //真機調試可以實時修改 $ ionic package <MODE> <PLATFORM> $ ionic lib update 更新當前項目的ionic js類庫

• 1
• 2
• 3
• 4
• 5
• 6

• 1
• 2
• 3
• 4
• 5
• 6

最好在config.xml配置一下白名單：

<allow-navigation href="http://www.abcdefg.com/*" />

• 1

• 1

發布

加一個文件

在ionic/platforms/android下建一個build-extras.gradle?
內容：

android { lintOptions { checkReleaseBuilds false } }

• 1

• 1

編譯命令：

ionic build –release android

產生密鑰：

keytool -genkey -alias demo.keystore -keyalg RSA -validity 40000 -keystore demo.keystore?
/*說明：-genkey 產生密鑰?
-alias demo.keystore 別名 demo.keystore?
-keyalg RSA 使用RSA算法對簽名加密?
-validity 40000 有效期限4000天?
-keystore demo.keystore */?
簽名：?
jarsigner -verbose -keystore demo.keystore -signedjar demo_signed.apk demo.apk demo.keystore?
/*說明：-verbose 輸出簽名的詳細信息?
-keystore demo.keystore 密鑰庫位置?
-signedjar demor_signed.apk demo.apk demo.keystore 正式簽名，三個參數中依次為簽名后產生的文件demo_signed，要簽名的文件demo.apk和密鑰庫demo.keystore.*/

zipalign(壓縮對齊)優化你的APK文件

zipalign -v 4 demo_signed.apk final.apk

轉載于:https://www.cnblogs.com/Ricezhang/p/6159313.html

總結

以上是生活随笔為你收集整理的ionic 混合应用开发的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。