Ionic環(huán)境配置及android打包環(huán)境搭建步驟:

Ionic環(huán)境配置及android打包環(huán)境搭建步驟:

1、安裝node.js ?這是為了使用npm來安裝ant,cordova是掰,ionic?驗(yàn)證是否安裝好node.js的方法是在命令提示符中輸入“node -v” ? ? 若出現(xiàn)版本號(hào)复凳,證明安裝成功。?nodejs 中文網(wǎng)站?http://nodejs.cn/?下載安裝就可以了 ? 安裝步驟可以參考?http://www.runoob.com/nodejs/nodejs-install-setup.html

?2谋右、下載jdk硬猫,并配置java環(huán)境(網(wǎng)上教程很多)? ? ? 驗(yàn)證是否安裝好的方法是在命令提示符中輸入“javac”? ? ? 若出現(xiàn)如下內(nèi)容,證明安裝成功。 ?

??3啸蜜、安裝ant,并配置相應(yīng)的環(huán)境(網(wǎng)上搜教程)? ? ? 驗(yàn)證是否安裝好ant的方法是在命令提示符中輸入“ant -v”? ? ? 若出現(xiàn)版本號(hào)坑雅,證明安裝成功。

4衬横、安裝cordova?? ? 安裝不成功通過如下方式:?npm install -g cnpm --registry=https://registry.npm.taobao.org? ? 執(zhí)行成功后裹粤,輸入?cnpm install -g cordova 安裝? ? 驗(yàn)證是否安裝好cordova的方法是在命令提示符中輸入“cordova -v”? ? 若出現(xiàn)版本號(hào),證明安裝成功蜂林。

5遥诉、安裝express ?? ? ?cmd 輸入:npm ?install express ?等待一會(huì)即可

6、安裝android sdk 配置環(huán)境變量 ?cmd->adb?

7噪叙、安裝Ionic ?? ? 驗(yàn)證是否安裝好ionic的方法是在命令提示符中輸入“ionic -v”? ? 若出現(xiàn)版本號(hào)矮锈,證明安裝成功。

創(chuàng)建Ionic項(xiàng)目Ionic官網(wǎng)提供了三個(gè)項(xiàng)目模板blank构眯、tabs和sideMenu 愕难,參閱:http://ionicframework.com/getting-started/?我們使用blank空模板創(chuàng)建一個(gè)我們的應(yīng)用,并且完成一個(gè)簡(jiǎn)單的tabs導(dǎo)航的小應(yīng)用惫霸,打開PowerShell cd到開發(fā)目錄猫缭,執(zhí)行:1ionic start myIonic blank?其中myIonic為我們的項(xiàng)目名稱?執(zhí)行過程它會(huì)從github下載項(xiàng)目源碼,請(qǐng)等待壹店。猜丹。。?執(zhí)行完畢后你到開發(fā)目錄下查看會(huì)發(fā)現(xiàn)多了一個(gè)名為myIonic的文件夾硅卢,這個(gè)文件夾就是Ionic項(xiàng)目的所在目錄了射窒。?目錄下有以下文件: 因?yàn)镮onic是基于angularjs框架開發(fā)的,所以在使用Ionic之前需要對(duì)angularjs有一定的了解将塑。?在開發(fā)初期的調(diào)試我們一般會(huì)使用瀏覽器作為我們的調(diào)試工具脉顿,Ionic提供了一個(gè)serve命令為我們的應(yīng)用創(chuàng)建web站點(diǎn)可1ionic serve?  執(zhí)行完畢后Ionic會(huì)自動(dòng)幫我們打開我們的默認(rèn)瀏覽器并跳轉(zhuǎn)到我們的應(yīng)用頁面,瀏覽器打開頁面時(shí)Ionic已經(jīng)給我們開啟了livereload模式点寥,開啟之后我們編輯www下的文件后保存時(shí)Ionic會(huì)通過websocket通知瀏覽器刷新頁面艾疟,我們就不用每次修改完畢手動(dòng)刷新頁面了,又極大的提高了我們的工作效率敢辩。PS. 開啟livereload后Ionic會(huì)默認(rèn)監(jiān)聽www下面的文件蔽莱,如果需要自定義的話請(qǐng)編輯ionic.project的watchPatterns來設(shè)置需要監(jiān)聽的范圍1234567891011{???"name":?"myIonic",???"app_id":?"",???"watchPatterns": [?????????"www/js/*",?????????"www/js/*/*",?????????"www/*.html",?????????"www/templates/*.html",?????????"www/css/*.css"????]?}?  www/index.html作為我們的程序入口文件,首先編輯這個(gè)文件戚长,在body標(biāo)簽中加入12345?

??這段標(biāo)簽對(duì)于對(duì)Ionic不熟悉的人來說可能有點(diǎn)陌生盗冷,Ionic針對(duì)移動(dòng)端自定義了一套樣式庫,并且使用Angular的指令封裝了各個(gè)模塊同廉,ion-nav-bar是導(dǎo)航頁面頭部仪糖、ion-nav-view是導(dǎo)航內(nèi)容頁面柑司。inde.html入口頁面我們已經(jīng)寫完了,接下來我們新建兩個(gè)我們自己的頁面乓诽。我們?cè)趙ww目錄下新建一個(gè)templates文件夾帜羊,存放我們的頁面并新建頁面:tabs.html?作為我們tab應(yīng)用的主頁面:12345678910ion-tab為tab應(yīng)用的底部菜單項(xiàng)?title是菜單按鈕顯示的文字,icon是菜單按鈕圖標(biāo)鸠天,href是點(diǎn)擊菜單的跳轉(zhuǎn)地址,子元素ion-nav-view是點(diǎn)擊菜單后子頁面顯示的位置帐姻,ion-nav-view屬性name為該tab的名稱稠集,后面添加子頁面會(huì)詳細(xì)描述。然后在app.js中加入該頁面的路由1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556// Ionic Starter App????// angular.module is a global place for creating, registering and retrieving Angular modules?// 'starter' is the name of this angular module example (also set in a? attribute in index.html)?// the 2nd parameter is an array of 'requires'?angular.module('starter', ['ionic']).config(function ($stateProvider, $urlRouterProvider) {???$stateProvider?????.state('tabs', {???????url:?"/tab",???????abstract:?true,???????templateUrl:?"templates/tabs.html",?????})?????.state('tabs.home', {???????url:?"/home",???????views: {?????????'home-tab': {???????????templateUrl:?"templates/home.html"?????????}???????}?????})?????.state('tabs.facts', {???????url:?"/facts",???????views: {?????????'home-tab': {???????????templateUrl:?"templates/facts.html"?????????}???????}?????})?????.state('tabs.about', {???????url:?"/about",???????views: {?????????'about-tab': {???????????templateUrl:?"templates/about.html"?????????}???????}?????})???$urlRouterProvider.otherwise("/tab/home");?})????.run(function($ionicPlatform) {???$ionicPlatform.ready(function() {?????if(window.cordova && window.cordova.plugins.Keyboard) {???????// Hide the accessory bar by default (remove this to show the accessory bar above the keyboard???????// for form inputs)???????cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);??????????// Don't remove this line unless you know what you are doing. It stops the viewport???????// from snapping when text inputs are focused. Ionic handles this internally for???????// a much nicer keyboard experience.???????cordova.plugins.Keyboard.disableScroll(true);?????}?????if(window.StatusBar) {???????StatusBar.styleDefault();?????}???});?})?哈饥瓷,我們tab應(yīng)用的大概樣子已經(jīng)出來了剥纷,但是現(xiàn)在點(diǎn)擊下面的菜單并沒有什么反應(yīng),接下來我們就要開始添加我們的子頁面了呢铆,在templates文件夾中新建:home.html晦鞋、facts.html、about.html?home.html 首頁1234567Scientific Facts?

??????facts.html1234567Home?

??????about.html1234567?

????????About Us?

??????ion-view是我們子頁面的內(nèi)容棺克,屬性view-title可以設(shè)置頁面頭部的標(biāo)題名稱悠垛,添加好文件后我們需要在app.js中加入各個(gè)頁面的路由,并且需要對(duì)之前的tabs路由做一個(gè)調(diào)整娜谊。大家發(fā)現(xiàn)tabs路由增加了一個(gè)abstract字段确买,該字段在angular中的解釋是抽象頁面,不能獨(dú)立作為頁面展示只能作為其他頁面父頁面纱皆,當(dāng)加載子頁面之前加載父頁面湾趾。?其他子頁面的路由和tabs路由的配置有所不同名稱命名是父路由.子路由的形式,并且增加了一個(gè)views字典派草,字段的key值對(duì)應(yīng)著我們前面所說的tabs.html中ion-nav-view的name屬性搀缠,表示該路由跳轉(zhuǎn)的頁面屬于某個(gè)tab的子頁面,同時(shí)修改我們的otherwise默認(rèn)頁為/tab/home近迁。?保存之后瀏覽器自動(dòng)刷新艺普,我們來看一下效果。?好了钳踊,我們來點(diǎn)點(diǎn)看吧衷敌,頁面切換Ionic已經(jīng)幫我們實(shí)現(xiàn)了類似原生app的切換動(dòng)畫效果,是不是有一點(diǎn)原生app的感覺了拓瞪?下面章節(jié)我們會(huì)實(shí)現(xiàn)在移動(dòng)端的部署部署到手機(jī)和cordova插件的使用一個(gè)簡(jiǎn)單的Web應(yīng)用我們已經(jīng)開發(fā)完成了缴罗,接下來我們就要做一些部署到移動(dòng)端之前的準(zhǔn)備了。?Ionic支持兩個(gè)平臺(tái)ios祭埂、android面氓,默認(rèn)的Ionic項(xiàng)目并沒有添加這兩個(gè)平臺(tái)兵钮,我們需要手動(dòng)添加,cd到開發(fā)目錄下執(zhí)行命令:12ionic platform add android??ionic platform add ios?一般項(xiàng)目都需要兩個(gè)平臺(tái)同時(shí)部署舌界,所以我們就添加兩個(gè)掘譬,執(zhí)行完畢之后執(zhí)行命令查看你已經(jīng)添加的平臺(tái)列表:1ionic platform list?結(jié)果:12Installed platforms: android 4.0.0, ios 3.8.0?Available platforms: amazon-fireos, blackberry10, browser, firefoxos, windows, windows8, wp8接下來的部署我們分開講述:Android?Android部署分真機(jī)和虛擬機(jī),其實(shí)方法類似呻拌,在部署之前需要安裝JDK葱轩、Android SDK到開發(fā)環(huán)境中,配置好JDK的JAVA_HOME和Android SDK的ANDROID_HOME到環(huán)境變量中去藐握,并把Android SDK安裝目錄添加到Path中靴拱。?配置好之后打開PowerShell輸入命令返回正確:1adb version?接下來就簡(jiǎn)單了,把手機(jī)連接到電腦猾普,并開啟usb調(diào)試模式袜炕,執(zhí)行命令:1ionic run android??Ionic開始編譯項(xiàng)目生成apk并遠(yuǎn)程安裝到手機(jī)上后自動(dòng)打開應(yīng)用,是不是很簡(jiǎn)單初家???調(diào)試我們?cè)谇懊嬉呀?jīng)說過偎窘,在開發(fā)前期我們一般會(huì)在web中調(diào)試,而Ionic為我們提供了非常方面的web調(diào)試環(huán)境溜在,只需要執(zhí)行ionic serve就可以實(shí)現(xiàn)lievereload陌知,而在部署到移動(dòng)端后也可以開啟livereload的,我們只需要修改下我們r(jià)un命令參數(shù):1ionic run android --livereload -c -s?這是android的調(diào)試模式炕泳,無論在虛擬機(jī)上還是在手機(jī)上都可以實(shí)現(xiàn)livereload纵诞,不用每次開發(fā)完成編譯再部署!-c是開啟客戶端日志輸出培遵,-s是開啟服務(wù)器端日志輸出浙芙。???android打包能使用Ionic來開發(fā)app的很可能對(duì)Ios和android的app打包發(fā)布流程不是很熟悉,我這里簡(jiǎn)單說明下:?Android?Android的打包比較簡(jiǎn)單執(zhí)行命令:1ionic build android -release??找到www/platform目錄下生成的apk包籽腕,此時(shí)的apk還不能被安裝到手機(jī)上嗡呼,還需要一步簽名操作,大家可以參考:http://www.cnblogs.com/qianxudetianxia/archive/2011/04/09/2010468.html?創(chuàng)建key皇耗,需要用到keytool.exe (位于jdk1.6.0_24\jre\bin目錄下)南窗,使用產(chǎn)生的key對(duì)apk簽名用到的是jarsigner.exe (位于jdk1.6.0_24\bin目錄下),把上兩個(gè)軟件所在的目錄添加到環(huán)境變量path后郎楼,打開cmd輸入D:\>keytool -genkey -alias demo.keystore -keyalg RSA -validity 40000 -keystore demo.keystore/*說明:-genkey 產(chǎn)生密鑰???????-alias demo.keystore 別名 demo.keystore???????-keyalg RSA 使用RSA算法對(duì)簽名加密???????-validity 40000 有效期限4000天???????-keystore demo.keystore */D:\>jarsigner -verbose -keystore demo.keystore -signedjar demo_signed.apk demo.apk demo.keystore/*說明:-verbose 輸出簽名的詳細(xì)信息???????-keystore? demo.keystore 密鑰庫位置???????-signedjar demor_signed.apk demo.apk demo.keystore 正式簽名万伤,三個(gè)參數(shù)中依次為簽名后產(chǎn)生的文件demo_signed,要簽名的文件demo.apk和密鑰庫demo.keystore.*/  注意事項(xiàng):android工程的bin目錄下的demo.apk默認(rèn)是已經(jīng)使用debug用戶簽名的呜袁,所以不能使用上述步驟對(duì)此文件再次簽名敌买。正確步驟應(yīng)該是:在工程點(diǎn)擊右鍵->Anroid Tools-Export Unsigned Application Package導(dǎo)出的apk采用上述步驟簽名。

Ionic環(huán)境配置及android打包環(huán)境搭建步驟:

1阶界、安裝node.js ?這是為了使用npm來安裝ant虹钮,cordova聋庵,ionic?驗(yàn)證是否安裝好node.js的方法是在命令提示符中輸入“node -v” ? ? 若出現(xiàn)版本號(hào),證明安裝成功芙粱。?nodejs 中文網(wǎng)站?http://nodejs.cn/?下載安裝就可以了 ? 安裝步驟可以參考?http://www.runoob.com/nodejs/nodejs-install-setup.html

?2祭玉、下載jdk,并配置java環(huán)境(網(wǎng)上教程很多)? ? ? 驗(yàn)證是否安裝好的方法是在命令提示符中輸入“javac”? ? ? 若出現(xiàn)如下內(nèi)容春畔,證明安裝成功倔撞。 ?

??3袄简、安裝ant,并配置相應(yīng)的環(huán)境(網(wǎng)上搜教程)? ? ? 驗(yàn)證是否安裝好ant的方法是在命令提示符中輸入“ant -v”? ? ? 若出現(xiàn)版本號(hào)颜屠,證明安裝成功腰湾。

4恒削、安裝cordova?? ? 安裝不成功通過如下方式:?npm install -g cnpm --registry=https://registry.npm.taobao.org? ? 執(zhí)行成功后鳖谈,輸入?cnpm install -g cordova 安裝? ? 驗(yàn)證是否安裝好cordova的方法是在命令提示符中輸入“cordova -v”? ? 若出現(xiàn)版本號(hào)驱入,證明安裝成功俐载。

5多矮、安裝express ?? ? ?cmd 輸入:npm ?install express ?等待一會(huì)即可

6缓淹、安裝android sdk 配置環(huán)境變量 ?cmd->adb?

7、安裝Ionic ?? ? 驗(yàn)證是否安裝好ionic的方法是在命令提示符中輸入“ionic -v”? ? 若出現(xiàn)版本號(hào)塔逃,證明安裝成功讯壶。創(chuàng)建Ionic項(xiàng)目Ionic官網(wǎng)提供了三個(gè)項(xiàng)目模板blank、tabs和sideMenu 湾盗,參閱:http://ionicframework.com/getting-started/?我們使用blank空模板創(chuàng)建一個(gè)我們的應(yīng)用伏蚊,并且完成一個(gè)簡(jiǎn)單的tabs導(dǎo)航的小應(yīng)用,打開PowerShell cd到開發(fā)目錄格粪,執(zhí)行:1ionic start myIonic blank?其中myIonic為我們的項(xiàng)目名稱?執(zhí)行過程它會(huì)從github下載項(xiàng)目源碼躏吊,請(qǐng)等待。帐萎。比伏。?執(zhí)行完畢后你到開發(fā)目錄下查看會(huì)發(fā)現(xiàn)多了一個(gè)名為myIonic的文件夾,這個(gè)文件夾就是Ionic項(xiàng)目的所在目錄了疆导。?目錄下有以下文件: 因?yàn)镮onic是基于angularjs框架開發(fā)的赁项,所以在使用Ionic之前需要對(duì)angularjs有一定的了解。?在開發(fā)初期的調(diào)試我們一般會(huì)使用瀏覽器作為我們的調(diào)試工具澈段,Ionic提供了一個(gè)serve命令為我們的應(yīng)用創(chuàng)建web站點(diǎn)可1ionic serve?  執(zhí)行完畢后Ionic會(huì)自動(dòng)幫我們打開我們的默認(rèn)瀏覽器并跳轉(zhuǎn)到我們的應(yīng)用頁面悠菜,瀏覽器打開頁面時(shí)Ionic已經(jīng)給我們開啟了livereload模式,開啟之后我們編輯www下的文件后保存時(shí)Ionic會(huì)通過websocket通知瀏覽器刷新頁面败富,我們就不用每次修改完畢手動(dòng)刷新頁面了悔醋,又極大的提高了我們的工作效率。PS. 開啟livereload后Ionic會(huì)默認(rèn)監(jiān)聽www下面的文件囤耳,如果需要自定義的話請(qǐng)編輯ionic.project的watchPatterns來設(shè)置需要監(jiān)聽的范圍1234567891011{???"name":?"myIonic",???"app_id":?"",???"watchPatterns": [?????????"www/js/*",?????????"www/js/*/*",?????????"www/*.html",?????????"www/templates/*.html",?????????"www/css/*.css"????]?}?  www/index.html作為我們的程序入口文件篙顺,首先編輯這個(gè)文件偶芍,在body標(biāo)簽中加入12345?

??這段標(biāo)簽對(duì)于對(duì)Ionic不熟悉的人來說可能有點(diǎn)陌生,Ionic針對(duì)移動(dòng)端自定義了一套樣式庫德玫,并且使用Angular的指令封裝了各個(gè)模塊匪蟀,ion-nav-bar是導(dǎo)航頁面頭部、ion-nav-view是導(dǎo)航內(nèi)容頁面宰僧。inde.html入口頁面我們已經(jīng)寫完了材彪,接下來我們新建兩個(gè)我們自己的頁面。我們?cè)趙ww目錄下新建一個(gè)templates文件夾琴儿,存放我們的頁面并新建頁面:tabs.html?作為我們tab應(yīng)用的主頁面:12345678910ion-tab為tab應(yīng)用的底部菜單項(xiàng)?title是菜單按鈕顯示的文字段化,icon是菜單按鈕圖標(biāo),href是點(diǎn)擊菜單的跳轉(zhuǎn)地址造成,子元素ion-nav-view是點(diǎn)擊菜單后子頁面顯示的位置显熏,ion-nav-view屬性name為該tab的名稱,后面添加子頁面會(huì)詳細(xì)描述晒屎。然后在app.js中加入該頁面的路由1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556// Ionic Starter App????// angular.module is a global place for creating, registering and retrieving Angular modules?// 'starter' is the name of this angular module example (also set in a? attribute in index.html)?// the 2nd parameter is an array of 'requires'?angular.module('starter', ['ionic']).config(function ($stateProvider, $urlRouterProvider) {???$stateProvider?????.state('tabs', {???????url:?"/tab",???????abstract:?true,???????templateUrl:?"templates/tabs.html",?????})?????.state('tabs.home', {???????url:?"/home",???????views: {?????????'home-tab': {???????????templateUrl:?"templates/home.html"?????????}???????}?????})?????.state('tabs.facts', {???????url:?"/facts",???????views: {?????????'home-tab': {???????????templateUrl:?"templates/facts.html"?????????}???????}?????})?????.state('tabs.about', {???????url:?"/about",???????views: {?????????'about-tab': {???????????templateUrl:?"templates/about.html"?????????}???????}?????})???$urlRouterProvider.otherwise("/tab/home");?})????.run(function($ionicPlatform) {???$ionicPlatform.ready(function() {?????if(window.cordova && window.cordova.plugins.Keyboard) {???????// Hide the accessory bar by default (remove this to show the accessory bar above the keyboard???????// for form inputs)???????cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);??????????// Don't remove this line unless you know what you are doing. It stops the viewport???????// from snapping when text inputs are focused. Ionic handles this internally for???????// a much nicer keyboard experience.???????cordova.plugins.Keyboard.disableScroll(true);?????}?????if(window.StatusBar) {???????StatusBar.styleDefault();?????}???});?})?哈喘蟆,我們tab應(yīng)用的大概樣子已經(jīng)出來了,但是現(xiàn)在點(diǎn)擊下面的菜單并沒有什么反應(yīng)鼓鲁,接下來我們就要開始添加我們的子頁面了蕴轨,在templates文件夾中新建:home.html、facts.html骇吭、about.html?home.html 首頁1234567Scientific Facts?

??????facts.html1234567Home?

??????about.html1234567?

????????About Us?

??????ion-view是我們子頁面的內(nèi)容橙弱,屬性view-title可以設(shè)置頁面頭部的標(biāo)題名稱,添加好文件后我們需要在app.js中加入各個(gè)頁面的路由燥狰,并且需要對(duì)之前的tabs路由做一個(gè)調(diào)整棘脐。大家發(fā)現(xiàn)tabs路由增加了一個(gè)abstract字段,該字段在angular中的解釋是抽象頁面碾局,不能獨(dú)立作為頁面展示只能作為其他頁面父頁面荆残,當(dāng)加載子頁面之前加載父頁面。?其他子頁面的路由和tabs路由的配置有所不同名稱命名是父路由.子路由的形式净当,并且增加了一個(gè)views字典内斯,字段的key值對(duì)應(yīng)著我們前面所說的tabs.html中ion-nav-view的name屬性,表示該路由跳轉(zhuǎn)的頁面屬于某個(gè)tab的子頁面像啼,同時(shí)修改我們的otherwise默認(rèn)頁為/tab/home俘闯。?保存之后瀏覽器自動(dòng)刷新,我們來看一下效果忽冻。?好了真朗,我們來點(diǎn)點(diǎn)看吧,頁面切換Ionic已經(jīng)幫我們實(shí)現(xiàn)了類似原生app的切換動(dòng)畫效果僧诚,是不是有一點(diǎn)原生app的感覺了遮婶?下面章節(jié)我們會(huì)實(shí)現(xiàn)在移動(dòng)端的部署部署到手機(jī)和cordova插件的使用一個(gè)簡(jiǎn)單的Web應(yīng)用我們已經(jīng)開發(fā)完成了蝗碎,接下來我們就要做一些部署到移動(dòng)端之前的準(zhǔn)備了。?Ionic支持兩個(gè)平臺(tái)ios旗扑、android蹦骑,默認(rèn)的Ionic項(xiàng)目并沒有添加這兩個(gè)平臺(tái),我們需要手動(dòng)添加臀防,cd到開發(fā)目錄下執(zhí)行命令:12ionic platform add android??ionic platform add ios?一般項(xiàng)目都需要兩個(gè)平臺(tái)同時(shí)部署眠菇,所以我們就添加兩個(gè),執(zhí)行完畢之后執(zhí)行命令查看你已經(jīng)添加的平臺(tái)列表:1ionic platform list?結(jié)果:12Installed platforms: android 4.0.0, ios 3.8.0?Available platforms: amazon-fireos, blackberry10, browser, firefoxos, windows, windows8, wp8接下來的部署我們分開講述:Android?Android部署分真機(jī)和虛擬機(jī)袱衷,其實(shí)方法類似捎废,在部署之前需要安裝JDK、Android SDK到開發(fā)環(huán)境中致燥,配置好JDK的JAVA_HOME和Android SDK的ANDROID_HOME到環(huán)境變量中去登疗,并把Android SDK安裝目錄添加到Path中。?配置好之后打開PowerShell輸入命令返回正確:1adb version?接下來就簡(jiǎn)單了嫌蚤,把手機(jī)連接到電腦谜叹,并開啟usb調(diào)試模式,執(zhí)行命令:1ionic run android??Ionic開始編譯項(xiàng)目生成apk并遠(yuǎn)程安裝到手機(jī)上后自動(dòng)打開應(yīng)用搬葬,是不是很簡(jiǎn)單???調(diào)試我們?cè)谇懊嬉呀?jīng)說過艳悔,在開發(fā)前期我們一般會(huì)在web中調(diào)試急凰,而Ionic為我們提供了非常方面的web調(diào)試環(huán)境,只需要執(zhí)行ionic serve就可以實(shí)現(xiàn)lievereload猜年,而在部署到移動(dòng)端后也可以開啟livereload的抡锈,我們只需要修改下我們r(jià)un命令參數(shù):1ionic run android --livereload -c -s?這是android的調(diào)試模式,無論在虛擬機(jī)上還是在手機(jī)上都可以實(shí)現(xiàn)livereload乔外,不用每次開發(fā)完成編譯再部署床三!-c是開啟客戶端日志輸出,-s是開啟服務(wù)器端日志輸出杨幼。???android打包能使用Ionic來開發(fā)app的很可能對(duì)Ios和android的app打包發(fā)布流程不是很熟悉撇簿,我這里簡(jiǎn)單說明下:?Android?Android的打包比較簡(jiǎn)單執(zhí)行命令:1ionic build android -release??找到www/platform目錄下生成的apk包,此時(shí)的apk還不能被安裝到手機(jī)上差购,還需要一步簽名操作四瘫,大家可以參考:http://www.cnblogs.com/qianxudetianxia/archive/2011/04/09/2010468.html?創(chuàng)建key,需要用到keytool.exe (位于jdk1.6.0_24\jre\bin目錄下)欲逃,使用產(chǎn)生的key對(duì)apk簽名用到的是jarsigner.exe (位于jdk1.6.0_24\bin目錄下)找蜜,把上兩個(gè)軟件所在的目錄添加到環(huán)境變量path后,打開cmd輸入D:\>keytool -genkey -alias demo.keystore -keyalg RSA -validity 40000 -keystore demo.keystore/*說明:-genkey 產(chǎn)生密鑰???????-alias demo.keystore 別名 demo.keystore???????-keyalg RSA 使用RSA算法對(duì)簽名加密???????-validity 40000 有效期限4000天???????-keystore demo.keystore */D:\>jarsigner -verbose -keystore demo.keystore -signedjar demo_signed.apk demo.apk demo.keystore/*說明:-verbose 輸出簽名的詳細(xì)信息???????-keystore? demo.keystore 密鑰庫位置???????-signedjar demor_signed.apk demo.apk demo.keystore 正式簽名稳析,三個(gè)參數(shù)中依次為簽名后產(chǎn)生的文件demo_signed洗做,要簽名的文件demo.apk和密鑰庫demo.keystore.*/  注意事項(xiàng):android工程的bin目錄下的demo.apk默認(rèn)是已經(jīng)使用debug用戶簽名的弓叛,所以不能使用上述步驟對(duì)此文件再次簽名。正確步驟應(yīng)該是:在工程點(diǎn)擊右鍵->Anroid Tools-Export Unsigned Application Package導(dǎo)出的apk采用上述步驟簽名诚纸。

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末撰筷,一起剝皮案震驚了整個(gè)濱河市,隨后出現(xiàn)的幾起案子咬清,更是在濱河造成了極大的恐慌闭专,老刑警劉巖,帶你破解...
    沈念sama閱讀 206,214評(píng)論 6 481
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件旧烧,死亡現(xiàn)場(chǎng)離奇詭異影钉,居然都是意外死亡,警方通過查閱死者的電腦和手機(jī)掘剪,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 88,307評(píng)論 2 382
  • 文/潘曉璐 我一進(jìn)店門平委,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人夺谁,你說我怎么就攤上這事廉赔。” “怎么了匾鸥?”我有些...
    開封第一講書人閱讀 152,543評(píng)論 0 341
  • 文/不壞的土叔 我叫張陵蜡塌,是天一觀的道長(zhǎng)。 經(jīng)常有香客問我勿负,道長(zhǎng)馏艾,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 55,221評(píng)論 1 279
  • 正文 為了忘掉前任奴愉,我火速辦了婚禮琅摩,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘锭硼。我一直安慰自己房资,他們只是感情好,可當(dāng)我...
    茶點(diǎn)故事閱讀 64,224評(píng)論 5 371
  • 文/花漫 我一把揭開白布檀头。 她就那樣靜靜地躺著轰异,像睡著了一般。 火紅的嫁衣襯著肌膚如雪鳖擒。 梳的紋絲不亂的頭發(fā)上溉浙,一...
    開封第一講書人閱讀 49,007評(píng)論 1 284
  • 那天,我揣著相機(jī)與錄音蒋荚,去河邊找鬼戳稽。 笑死,一個(gè)胖子當(dāng)著我的面吹牛,可吹牛的內(nèi)容都是我干的惊奇。 我是一名探鬼主播互躬,決...
    沈念sama閱讀 38,313評(píng)論 3 399
  • 文/蒼蘭香墨 我猛地睜開眼,長(zhǎng)吁一口氣:“原來是場(chǎng)噩夢(mèng)啊……” “哼颂郎!你這毒婦竟也來了吼渡?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 36,956評(píng)論 0 259
  • 序言:老撾萬榮一對(duì)情侶失蹤乓序,失蹤者是張志新(化名)和其女友劉穎寺酪,沒想到半個(gè)月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體替劈,經(jīng)...
    沈念sama閱讀 43,441評(píng)論 1 300
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡寄雀,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 35,925評(píng)論 2 323
  • 正文 我和宋清朗相戀三年,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了陨献。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片盒犹。...
    茶點(diǎn)故事閱讀 38,018評(píng)論 1 333
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡,死狀恐怖眨业,靈堂內(nèi)的尸體忽然破棺而出急膀,到底是詐尸還是另有隱情,我是刑警寧澤龄捡,帶...
    沈念sama閱讀 33,685評(píng)論 4 322
  • 正文 年R本政府宣布卓嫂,位于F島的核電站,受9級(jí)特大地震影響聘殖,放射性物質(zhì)發(fā)生泄漏命黔。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 39,234評(píng)論 3 307
  • 文/蒙蒙 一就斤、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧蘑辑,春花似錦洋机、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,240評(píng)論 0 19
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至副砍,卻和暖如春衔肢,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背豁翎。 一陣腳步聲響...
    開封第一講書人閱讀 31,464評(píng)論 1 261
  • 我被黑心中介騙來泰國(guó)打工角骤, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留,地道東北人。 一個(gè)月前我還...
    沈念sama閱讀 45,467評(píng)論 2 352
  • 正文 我出身青樓邦尊,卻偏偏與公主長(zhǎng)得像背桐,于是被迫代替她去往敵國(guó)和親。 傳聞我的和親對(duì)象是個(gè)殘疾皇子蝉揍,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 42,762評(píng)論 2 345

推薦閱讀更多精彩內(nèi)容