場景

Ionic介紹

Ionic 是一個開源的移動應(yīng)用程序開發(fā)框架，它可以輕松地使用web 技術(shù)構(gòu)建高質(zhì)量的跨平
臺的移動應(yīng)用。可以讓我們快速開發(fā)移動App、移動端WEB 頁面、微信公眾平臺應(yīng)用，混
合app web 頁面等。
Ionic 基于Web Components，具有更好的運行速度，相比以前版本的Ionic 框架性能提升很
多。
Web Components 是一套不同的技術(shù)，允許您創(chuàng)建可重用的定制元素（它們的功能封裝在您
的代碼之外）并且在您的web 應(yīng)用中使用它們。目前WEB 組件目前仍然依靠各種類似”
Hack”的方式來模擬，模擬方式也各有不同，很難統(tǒng)一和標(biāo)準(zhǔn)化，而Web Components 則
直接提供了標(biāo)準(zhǔn)化的組件定義方式，這是組件標(biāo)準(zhǔn)化的基石，使得未來的組件能夠統(tǒng)一創(chuàng)建、
方法調(diào)用、事件監(jiān)聽、屬性訪問等。基于標(biāo)準(zhǔn)化的組件定義方式，我們便可以像W3C 等標(biāo)
準(zhǔn)組織一樣來定義組件標(biāo)準(zhǔn)，無需再依賴、等待“內(nèi)置”組件，這也使得我們獲得了“漁”
的能力。

注：

博客：
https://blog.csdn.net/badao_liumang_qizhi
關(guān)注公眾號
霸道的程序猿
獲取編程相關(guān)電子書、教程推送與免費下載。

實現(xiàn)

Ionic安裝

必須安裝node.js，建議安裝最新的穩(wěn)定版本。

然后管理員打開cmd,全局安裝cordova 和 ionic

全局安裝cordova

npm install -g cordova

或者

cnpm install -g cordova

?

全局安裝ionic

npm install -g? ionic

或者

cnpm install -g ionic

?

新建ionic項目

新建一個文件夾，然后在此處打開命令行，輸入

ionic start myApp tabs

其中myApp是項目名，后面tabs是項目配置項，tabs代表底部帶tab頁的項目結(jié)構(gòu)，其他選項還有

blank 空項目和 sidemenu 側(cè)邊欄菜單結(jié)構(gòu)

?

回車后會讓你選擇實現(xiàn)的語言這里選擇的是Angular，然后回車

?

如果在新建項目過程中出現(xiàn)卡頓，一直卡在npm i這個環(huán)節(jié)并且目錄下myApp下已經(jīng)有相應(yīng)的目錄結(jié)構(gòu)

?

此時可以繼續(xù)等待(很長時間)或者Ctrl + C,結(jié)束掉然后進(jìn)入到項目目錄

cd myApp

使用

cnpm install

安裝項目依賴

?

然后啟動項目

ionic serve

?

如果在啟動過程中遇到

Ionic啟動時提示:The Angular CLI requires a minimum Node.js version of eithor v10.13 or v12.0：

https://mp.csdn.net/console/editor/html/106308008

打開瀏覽器輸入：

localhost:8100

?

?

與50位技術(shù)專家面對面20年技術(shù)見證，附贈技術(shù)全景圖

總結(jié)

以上是生活随笔為你收集整理的Ionic介绍以及搭建环境、新建和运行项目的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。