前言：ionic 是一個強大的 HTML5 應用程序開發框架(HTML5 Hybrid Mobile App Framework )。 可以幫助您使用 Web 技術，比如 HTML、CSS 和 Javascript 構建接近原生體驗的移動應用程序。ionic 主要關注外觀和體驗，以及和你的應用程序的 UI 交互，特別適合用於基於 Hybird 模式的 HTML5 移動應用程序開發。ionic是一個輕量的手機UI庫，具有速度快，界面現代化、美觀等特點。爲了解決其他一些UI庫在手機上運行緩慢的問題，它直接放棄了IOS6和Android4.1以下的版本支持，來獲取更好的使用體驗。
針對不會原生開發app的小夥伴也許這就是福音，隨着技術的不斷變革與進化，前端開發的小夥伴也可以開發app啦！！！！！
個人感覺現在能很好實現app跨平臺開發體驗比較友好的是uniapp和ionic,而這篇文章着重介紹ionic開發環境的搭建。
具體步驟：：：：
1、安裝java jdk--參考安裝https://www.runoob.com/java/java-environment-setup.html
2、安裝node 環境--參考安裝https://www.runoob.com/nodejs/nodejs-install-setup.html
我們這裏搭建的ionic3 的開發環境所以node版本最好安裝最新的。同時檢查npm命令工具的版本是否爲最新的，沒有更新爲最新的
執行命令 npm i -g npm
查看npm 版本 npm -v
查看node 版本 node -v
3、安裝android sudio --參考安裝https://www.runoob.com/android/android-studio-install.html
重點：因爲ionic基於 Hybird 模式的 HTML5 移動應用程序開發，所以需要提供android sdk配置，但是在在搭建ionic3的環境中會出現各種錯誤，例如：android sdk環境變量配置？android studio 安裝？gradle 安裝？
1）、安裝android studio 參考 https://www.runoob.com/android/android-studio-install.html
通過android studio 開發工具安裝sdk ，打開工具 依次 configure -- SDK manager ---Android SDK --- 選擇一個android 版本（注意api level >=28，因爲在執行cordova build 中，版本太低會異常）
2）、安裝 gradle （ionic cordova使用gradle構建android）安裝參考https://www.w3cschool.cn/gradle/ctgm1htw.html
下載zip https://services.gradle.org/distributions/
3）、android studio 配置gradle ，依次configure -- settings -- gradle 配置安裝的gradle bin文件夾，同時配置gradle 環境變量
注意：注意查看gradle 版本
cmd執行刷新環境變量
set path=test
關閉cmd 命令窗口，再打開執行
echo %path%
（最好重啓一下電腦）
執行 命令 gradle -v
4）、配置android sdk 環境變量，在第一步中通過android studio 安裝了SDK ，找到SDK所在文件夾，配置環境變量
配置參考 1、https://www.jianshu.com/p/27c9c3835331 2、https://www.jianshu.com/p/0b9d705fc35f
4、安裝ionic和cordova 命令行：
npm install -g cordova ionic
如果你已經安裝了以上環境，可以執行以下命令來更新版本:
npm update -g cordova ionic
執行
cordova requirements
檢查 cordova 環境配置是否健康。
等命令行工具安裝完成就可以創建項目，打開電腦的命令行工具cmd，根據個人需要指定項目創建文件夾，
執行命令
ionic start myApp tabs
說明：myApp ----項目名稱，tabs ----指定項目使用模板（參考官方提供的模板）
執行如下命令：
cd ./myApp
ionic cordova platform add android
ionic cordova build android
ionic cordova emulate android
如果一切正常會彈出模擬器
異常歸類：：：：：：：：：：：：：：：
1、no devices/emulators found
注意android studio 配置模擬器
打開android studio 開發工具，依次configure -- AVD manager -- create virtual device 創建模擬器，如果沒有安裝對應版本的AVD 注意安裝，版本對應sdk版本。
開發ionic：：：：：：：：：：：：：：：：
Ionic Lab 是桌面版的開發環境，如果你不喜歡使用命令行操作，Ionic Lab 將會滿足你的需求。
Ionic Lab 爲開發者提供了一個更簡單的方法來開始，編譯，運行，和模擬運行Ionic的應用程序。
Ionic Lab 支持的平臺有：Window、Mac OS X、Linux，
下載 ionic lab 工具 下載地址 https://www.cnblogs.com/taceywong/p/5874661.html
Sublime Text 下載 http://www.sublimetext.com/3
備註：這裏使用 ionic lab 一直卡頓，最後放棄
這裏推薦使用過 vscode
下載地址 https://code.visualstudio.com/
參考文章：https://blog.csdn.net/yelllowcong/article/details/79354663
安裝 cordova tool 方便調試
ionic Android發佈：：：：：：：：：：：：：：：：
這裏懶得去寫了，請參考這位大俠的文章：：：
與開發版本不同，如若想要正式發佈的話需要執行編譯命令
ionic cordova build --release android
1
注意：發佈要使用Release版本，所以這裏加上–release選項。完成之後生成了未簽名的apk，在目錄platforms/android/build/outputs/apk/HelloWorld-release-unsigned.apk。
生產key
keytool -genkey -v -keystore my-release-key.keystore -alias alias_name -keyalg RSA -keysize 2048 -validity 10000
1
這裏會問一些問題，填寫之後生成keystore文件。（git可能會出現中文亂碼的狀況。右擊git bash here => options => text => local選擇zh_CN character set選擇utf-8 或者GBK）
對apk文件進行簽名
首先切到platforms/android/build/outputs/apk/目錄中。然後把之前生成的keystore文件粘貼到同級目錄中。執行命令
jarsigner -verbose -sigalg SHA1withRSA -digestalg SHA1 -keystore my-release-key.keystore HelloWorld-release-unsigned.apk alias_name
1
HelloWorld-release-unsigned.apk 是之前未簽名的apk
alias_name是簽名之後的apk .
到這裏基本上就可以正式發佈了，不過個人建議還是使用zipalign優化一下apk
zipalign優化apk
筆者按照網上許多教程執行命令：
zipalign -v 4 notepad_signed.apk notepad_signed_aligned.apk
1
結果報錯找不到zipalign 最後筆者找到zipalign 所在目錄（zipalign是sdk的壓縮代碼工具，可以將我們的apk體積最小化,一般都在sdk安裝目錄build tools\25.0.1\zipalign.exe下 25.0.1是android sdk版本號）
在zipalign 所在文件目錄打開命令行。執行命令
zipalign -v 4 D:xxxxxxx\apk\android-release-unsigned.apk alias_name.apk
1
D:xxxxxxx\apk\ 是apk所在目錄
android-release-unsigned.apk 是未優化的apk的名字
alias_name.apk 是優化apk的名字
現在去你的zipalign所在的路徑，可以看到壓縮完成的apk文件。
現在就可以將我們壓縮完成的apk文件上傳到相應的應用市場，填寫相應的APP信息，等待審覈就可以了。
————————————————
版權聲明：本文爲CSDN博主「有夢想的風箏」的原創文章，遵循 CC 4.0 BY-SA 版權協議，轉載請附上原文出處鏈接及本聲明。
原文鏈接：https://blog.csdn.net/samll_cat/article/details/80860151