當前位置：首頁 > 编程资源 > 编程问答 >内容正文

编程问答

Ionic系列——环境配置和项目搭建

發布時間：2023/12/20 编程问答 28 豆豆

生活随笔收集整理的這篇文章主要介紹了 Ionic系列——环境配置和项目搭建小編覺得挺不錯的,現在分享給大家,幫大家做個參考.

2019獨角獸企業重金招聘Python工程師標準>>>

1、環境介紹

????Java jdk: 開發環境

????Android ADT: Ionic Android開發環境

????IOS Xcode: Ionic Ios開發環境

??? ANT: Cordova編譯工具

????Node: 開發環境

????Git: 源碼拉取下載

????Bower: 包管理工具

????Grunt: node項目構建工具

2、環境配置

2.1、Java? jdk環境

????下載安裝Java jdk環境，并添加到環境變量 JAVA_HOME? 中

????配置JAVA的環境變量： http://jingyan.baidu.com/article/f96699bb8b38e0894e3c1bef.html

2.2、操作平臺環境

2.2.1、Android ADT（Android Development Tools）環境

????下載安裝ADT 并添加到環境變量? ANDROID_HOME? 中

????如何設置Android環境變量：http://jingyan.baidu.com/article/22a299b51c59d69e19376af8.html

???

????①首先下載android sdk tools并安裝

??? Android工具下載網址：http://www.androiddevtools.cn/

??????????????????????????????????????? www.androiddevtools.cn若跳轉失敗請手動復制到瀏覽器中打開

????②我在安裝ionic的時候他說需要安裝最新的sdk，就是android22所以需要越獄下載 ??

?????Android 5.1 API 22 所有sdk文件下載地址? http://www.oschina.net/question/1539302_227672

????③搭建android? AVD模擬環境一直沒搞通

????如何新建安卓AVD虛擬模擬器? http://jingyan.baidu.com/article/a681b0ded7e7573b1943465b.html

2.2.2、IOS xcode環境

?暫時只搞了android的，稍后完善！在windows上面安裝ios和在ios上添加android環境都比較麻煩。

????但如果你是蘋果筆記本，你開發Ionic只需要安裝一個Node環境就可以開發了。

2.3、ANT環境

????下載安裝ANT 并添加到環境變量?ANT_HOME? 中

????ANT的安裝和環境變量配置: http://jingyan.baidu.com/article/90808022c5eed8fd91c80f90.html?

????ANT官網下載地址：http://ant.apache.org/

????有的時候需要用管理員打開，可能涉及權限問題。（這句話忘了說什么了，先放著）

2.4、Node環境

????下載安裝Node

??? Node官網下載地址：https://nodejs.org/download/

2.5、Git環境

????下載安裝Git 并添加到環境變量中

????git的安裝和配置：http://jingyan.baidu.com/article/9f7e7ec0b17cac6f2815548d.html

??? Node官網下載地址：https://nodejs.org/download/

2.6、Bower和Grunt

?????之后我會在另一篇博客中完善bower的使用，下載配置，忽略文件等的使用。

npm?install?-g?bower npm?install?-g?grunt

3、Ionic項目創建

3.1、安裝ionic和cordova

????添加的時候最好用cmd的管理員身份運行

npm?install?-g?cordova?ionic

3.2、創建項目

$?ionic?start?myproject??開始第一個項目，默認是tab $?ionic?start?webApp?blank $?ionic?start?webApp?tabs $?ionic?start?webApp?sidemenu

3.3、打包項目運行

??? android在項目中打開cmd命令窗口：

?ionic?platform?add?android（添加android平臺，在項目中只需要運行一次）ionic?build?android（生成androidapk）ionic?run?androidionic?emulate?android（在android模擬器或真機中模擬）這是在虛擬中運行ionic?serve可自動打開瀏覽器直接在瀏覽器測試

????Ios在項目中打開cmd命令窗口：

$?ionic?platform?add?ios $?ionic?build?ios(這樣生成的是app格式，還需要加ios證書變成ipa格式) $?ionic?emulate?ios

3.4、ng-cordova的使用

????Ionic系列——使用ng-cordova插件：http://my.oschina.net/u/1416844/blog/484693

4、項目介紹

????介紹項目中文件夾的意義和作用，忽略哪些上傳，剛拉取下來需要進行的操作，稍后完善！

5、錯誤處理

5.1 、在運行ionic build android的時候報錯

????[Error: ANDROID_HOME is not set and "android" command not in your PATH. You

????這個時候要這樣設置

????ANDROID_HOME：C:\environment\adt-bundle-windows-x86-20130917\sdk

????在path中寫：%ANDROID_HOME%\tools;%ANDROID_HOME%\platform-tools

5.2、node在添加-ng-cordova的時候存在跨磁盤移動的問題

????Error: EXDEV, cross-device link not permitted 'C:\Users\shiguoqing\AppData\Local \Temp\git\1435225811973\plugin.xml'

????我目前想到的解決辦法是把項目弄到node的安裝磁盤，然后在給弄回來，我現在項目挪到c盤去了。

5.3、創建AVD（安卓模擬器）報的錯誤

????①首先是這個問題，這是沒有安裝英特爾硬件加速執行管理器，要手動安裝一下。如果是自動安裝的androidSDK他已經集成在里面了，但也需要手動安裝一下。可以看下面的文章。

英特爾硬件加速執行管理器(英特爾 HAXM)是一款硬件輔助虛擬引擎(管理程序)安裝：? http://www.cnblogs.com/csulennon/p/4178404.html

????②這個問題Stack Overflow上給了一些解釋

????屏幕尺寸影響，多個虛擬機影響，攝像頭影響等

????emulator?window?was?out?of?view?and?was?recentred??? 這個是屏幕的尺寸選的有問題

????emulator: Failed to sync vcpu reg
????emulator: Failed to sync HAX vcpu context
????網上說這兩個問題，arm可以打開，intel的打不開了，加速器關了又能打開了，先在主板上打開Virtual tech，硬件加速才能用，另外，只有intel支持VT的CPU才行，我的電腦是acer4741g，說是默認開啟，但是bios中沒法設置。但是這兩個問題一直沒有解決，所以模擬器也沒有跑起來，各位大神有什么辦法？

????http://stackoverflow.com/questions/17024538/how-do-i-fix-failed-to-sync-vcpu-reg-error

③這個是問題是在環境變量配置的PATH中要添加上C:\Windows\System32

④我有一次從新裝機，一直遇到這個問題，找不到build-tools

折騰了半天，發現解決的辦法很簡單就是

?http://blog.csdn.net/langyuewu/article/details/46729985

轉載于:https://my.oschina.net/u/1416844/blog/486185

總結

以上是生活随笔為你收集整理的Ionic系列——环境配置和项目搭建的全部內容，希望文章能夠幫你解決所遇到的問題。

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