成人无码视频,亚洲精品久久久久av无码,午夜精品久久久久久毛片,亚洲 中文字幕 日韩 无码

資訊專欄INFORMATION COLUMN

ionic4+vue+cordova開(kāi)發(fā)混合應(yīng)用

Yujiaao / 3653人閱讀

摘要：摘要是可以讓我們使用開(kāi)發(fā)即使來(lái)移動(dòng)應(yīng)用的框架。如果你熟悉可以直接使用開(kāi)發(fā)，但如果你熟悉使用或并且也想使用，可以使用版本，本文就以來(lái)說(shuō)明這兩者如何結(jié)合使用。除此之外還引入和來(lái)對(duì)把我們代碼打包成安卓或應(yīng)用。。

摘要

ionic是可以讓我們使用web開(kāi)發(fā)即使來(lái)移動(dòng)應(yīng)用的框架。ionic4之前，ionic只能和angular搭配使用，ionic4后把ionic抽離成四個(gè)版本，@ionic/core，@ionic/angular，@ionic/react，@ionic/vue來(lái)滿足更多開(kāi)發(fā)者的需求，但是@ionic/vue和@ionic/react還處于內(nèi)部測(cè)試階段。如果你熟悉angular可以直接使用@ionic/angular開(kāi)發(fā)，但如果你熟悉使用react或vue并且也想使用ionic，可以使用@ionic/core版本，本文就以@ionic/core + vue 來(lái)說(shuō)明這兩者如何結(jié)合使用。除此之外ionic還引入cordova和capacitor來(lái)對(duì)把我們代碼打包成安卓或ios應(yīng)用。。https://ionicframework.com

使用ionic來(lái)搭建我們環(huán)境 安裝ionic腳手架 
npm install -g ionic
安裝androd stuiod來(lái)編譯android代碼 
https://ionicframework.com/docs/installation/android
安裝xcode來(lái)編譯ios代碼 
https://ionicframework.com/docs/installation/ios
初始化項(xiàng)目 用提供的模版為來(lái)測(cè)試環(huán)境是否已經(jīng)安裝成功 
ionic start myApp blank
在android studio上啟動(dòng) 
https://ionicframework.com/docs/building/android
1， ionic cordova prepare android
2， ionic cordova run android -l

在xcode上啟動(dòng) 
1，ionic cordova prepare ios
2, ionic cordova run ios -l

自己來(lái)搭建環(huán)境 
代碼可見(jiàn) https://github.com/gdutjiweijin/webapp
適應(yīng)vue-cli腳手架來(lái)搭建vue基礎(chǔ)基礎(chǔ)代碼 
1， npm install --global vue-cli
2， vue init webpack webapp
3， cd webapp
4,  yarn install
5,  yarn run dev
引入ionic@core

在index.html上加入

在main.js加入

Vue.config.ignoredElements = [/^ion-/];
初始化cordova項(xiàng)目 
1,cordova create cordovawebapp
2,cordova platform add android
3,cordova platform add ios
把我們代碼放入到cordova目錄 1）打包我們項(xiàng)目代碼 npm run build 2） 把dist目錄代碼拷貝到安卓對(duì)應(yīng)目錄上 
cp -r dist/ ./cordovawebapp/platforms/android/app/src/main/assets/www/
3）把dist目錄代碼拷貝到ios對(duì)應(yīng)目錄上 
cp -r dist/ ./cordovawebapp/platforms/ios/www/
具體代碼可參考https://github.com/gdutjiweij...，效果如下 web

android

ios

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://m.hztianpu.com/yun/103657.html

相關(guān)文章

  • Capacitor 新一代混合應(yīng)用“神器” 會(huì)代替Cordova嗎？？

    摘要：介紹暢想是由團(tuán)隊(duì)最新開(kāi)發(fā)維護(hù)的一個(gè)跨平臺(tái)的應(yīng)用程序容器，可以輕松構(gòu)建在，，和上本機(jī)運(yùn)行的應(yīng)用程序。后者旨在替代或者說(shuō)是進(jìn)化。希望看到在未來(lái)發(fā)展，以及正式發(fā)布。我認(rèn)為它有可能大大改善混合應(yīng)用開(kāi)發(fā)體驗(yàn)。 1.介紹or暢想 Capacitor是由ionic團(tuán)隊(duì)最新開(kāi)發(fā)維護(hù)的一個(gè)跨平臺(tái)的應(yīng)用程序容器，可以輕松構(gòu)建在iOS，Android，Electron和Web上本機(jī)運(yùn)行的Web應(yīng)用程序。我們...

    番茄西紅柿 評(píng)論0 收藏0

  • Ionic4+Vue+Capacitor 初體驗(yàn)

    摘要：最新的已經(jīng)提供了其他框架的支持，，等等，甚至不使用框架。接下來(lái)我將使用和開(kāi)發(fā)一個(gè)最簡(jiǎn)單的。也可以直接使用啟動(dòng)，運(yùn)行使用模擬器運(yùn)行項(xiàng)目完美，那么本次的初體驗(yàn)就到此結(jié)束了，的插件使用可以參考官方文檔哦。 注：本文的目的在于記錄自己基于最新的Ionic4構(gòu)建一個(gè)App，也為同樣需求的小伙伴提供參考。第一次寫(xiě)文章，文筆笨拙，還請(qǐng)見(jiàn)諒，不對(duì)之處，還請(qǐng)指出。 最新的Ionic4已經(jīng)提供了其他 j...

    cuieney 評(píng)論0 收藏0

  • 指尖前端重構(gòu)（React）技術(shù)調(diào)研分析

    摘要：一為什么選擇是當(dāng)前前端應(yīng)用最廣泛的框架。目前來(lái)看的生態(tài)系統(tǒng)要比大的多，在等最大的技術(shù)社區(qū)搜索兩者，的搜索結(jié)果是的十倍左右，另外據(jù)近期統(tǒng)計(jì)使用的站點(diǎn)是的幾百倍以上。其中是基于技術(shù)，依然是瀏覽器應(yīng)用。 一、為什么選擇React React是當(dāng)前前端應(yīng)用最廣泛的框架。三大SPA框架 Angular、React、Vue比較。 Angular出現(xiàn)最早，但其在原理上并沒(méi)有React創(chuàng)新的性能優(yōu)化...

    AlphaWallet 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

閱讀需要支付1元查看
<