大家好，vue開發移動端app相信很多的網友都不是很明白，包括vue能做app開發嗎也是一樣，不過沒有關系，接下來就來為大家分享關于vue開發移動端app和vue能做app開發嗎的一些知識點，大家可以關注收藏，免得下次來找不到哦，下面我們開始吧！
vue能開發混合app嗎
可以的呢，通過第三方的混合開發工具都可以把這個打包做成APP。
如何將html打包成一個app
這里介紹一個打包工具HBuilder，可以直接將html打包成手機app，下面我介紹一下這個工具的安裝和簡單使用，如下：
1.下載HBuilder，這個直接到官網下載就行，地址http://www.dcloud.io/，如下：
2.下載成功后，隨便解壓到一個目錄下邊，主要內容如下：
3.打開HBuilder，新建一個移動App應用，依次點擊“文件”->“新建”->“移動App”就行，我這里創建了一個Test應用，這里需要勾選“HelloH5+”，如下：
創建成功后，Test應用主要目錄結構如下：
4.為了方便測試，我這里新建了一個html文件—test.html，主要內容如下：
用瀏覽器打開后的效果如下：
5.下面我們就可以對這個html文件進行打包，雙擊打開manifest.json文件，設置test.html文件為入口文件，如下：
接著右擊Test應用，選擇“發行”->“云打包-打原生安裝包”，這里我以打包安卓程序為例，勾選“Android”，點擊打包就行，如下：
打包成功后，如下：
apk所在目錄（在unpackage目錄里邊），如下：
至此，html就已打包成功，可以直接安裝到安卓手機上，如下，成功安裝后的界面：
到此，我們就完成了將一個html打包成一個手機app，就整個過程來看，其實不難，就是步驟有些繁瑣，網上也有相關教程和資料，感興趣的可以搜一下，希望以上分享的內容能對你有所幫助吧。
vue開發的網站如何上傳到app storm
網站是無法上傳appstore的，上傳AppStore的必須是一個應用，所以可以考慮使用cordova等混合應用框架包裝起網站，或者其他PWA方式包起來，做成一個應用之后在上傳
會vue再上手uni-app難度大嗎
uni-app就是基于vue開發的框架，如果你會vue的話，入門應該是沒啥問題，如果上手去做項目的話，還是有些難度的。具體哪些難度我們得搞清楚uni-app到底是什么。
uni-app是一個使用Vue.js開發所有前端應用的框架，開發者編寫一套代碼，可發布到iOS、Android、H5、以及各種小程序（微信/支付寶/百度/頭條/QQ/釘釘）等多個平臺這是官網介紹的原話，咋一聽很厲害的樣子。發布到多個平臺只需要一套代碼，這樣的話效率高，成本又低。那為何大公司沒有采用uni-app進行開發呢？
1.我們先搞懂它為何能跨多個平臺從上圖我們可以看出uni-app跨平臺的原因了：適配每一個終端！
這就很像是java虛擬機了，不過java虛擬機是程序運行時工作，而uni-app是編譯時工作。
可以這樣理解，java虛擬機是在程序運行時，進行適配平臺，uni-app是在編譯時，根據你選擇的編譯平臺進行適配。
在編譯時解決平臺問題，這是目前很多跨平臺框架的首選解決方案，即保證效率又方便開發者。
但這種方案也有缺點，如果平臺變動或更新，那么有可能導致你app某些功能無法使用，必須等著uni-app維護升級。
這就是uni-app的跨平臺原理，現階段的跨平臺方案沒有完美的，都是有利有弊。
2.如果會Vue，是不是相當于會uni-app
是的，uni-app開發頁面用的就是Vue組件
上圖代碼是uni-app登陸模版項目里面的，可以看出來，用的就是Vue的template模版開發。
一般不涉及到平臺性的組件都是使用Vue開發的，所以如果你項目對跨平臺要求不高，而且會Vue的話可以直接上手開發uni-app
哪些組件是涉及到平臺性的呢？
比如彈窗，我們用Vue的話一般在template寫個dialog，而uni-app可以直接通過uni.showModal實現彈窗。當然這個例子不太嚴謹，Vue也能封裝一個這樣實現。這里主要講的是跨平臺，使用uni-app提供的組件基本不用擔心平臺適配問題。
為什么會Vue上手uni-app仍然有難度這里說的難度不是指寫代碼的難度，代碼都是用Vue寫的不存在啥難度。
1.難度是對跨平臺而言的，你需要懂各平臺運行app的原理。
uni-app代碼編譯打包后，移動端基本是運行在安卓的webview或ios的WKWebView。但是安卓或ios平臺為了效率或者安全性，不會去支持H5的一些危險特性或者功能，當然H5是安全的們這里的危險只是安卓和ios認為的。
比如ios的WKWebview，對H5一些新的css不支持或者不會太早的更新適配。
如果你不了解移動端webview的差異性，那么很容易踩雷，而且這些錯誤都是無法通過debug發現的。
2.uni-app無法適配的工作需要開發者來實現有些適配工作是uni-app無法通過編譯完成的，這就是需要開發者去實現了。
比如開發中，div、ul、li等得改為view，微信的wxcomponet不支持H5等等。
這里就增加了很多的開發成本，很多不支持跨平臺的vue組件用不了。
開發久了你可能會有這樣的感覺，會Vue開發uni-app比從頭學uni-app開發都難！
總結如果你會Vue，使用uni-app開發的話，上手是比較簡單的，但是如果項目涉及到跨平臺的話，就得斟酌下了，會有很多坑，一旦影響到業務功能的實現，就得不償失了。
如果你項目不涉及到移動端，就只在web和小程序上運行的話，可以使用uni-app開發。
都說后端造語言，移動端造系統，web端造框架。但在這個前端大融合的時代，系統框架已分的沒那么清楚。
而作為開發者，我們得知道，效率和成本是對立存在的，切勿因此失彼！
我是非著名攻城獅，原創不易，如果我的回答對你所幫助，還請點贊支持！
如何構建一個大型Vue應用程序
vue-cli3.0環境開發，在安裝vue之前我們需要安裝node環境，這個我們只要在node官方下載node綠色免安裝版，然后再配置下環境變量即可使用node和npm了。
將node所在目錄配置到電腦的環境變量中就可以使用了，這里我的目錄是D:\ProgramFiles\node-v10.8.0-win-x86，這里我們只要打開電腦-屬性-系統設定-進階-環境變量中獎該路徑添加到path中即可，快捷鍵“win+r”打開運行框，輸入cmd在彈出的窗口中輸入node-v檢查node.js是否安裝成功。
這里我們配置淘寶的鏡像源，這里設置永久的輸入命令：npmconfigsetregistryhttps://registry.npm.taobao.org/
//臨時npm--registryhttps://registry.npm.taobao.orginstallexpress//永久npmconfigsetregistryhttps://registry.npm.taobao.org//驗證是否成功npmconfiggetregistry
現在我們可以開始來搭建vue-cli3.0環境了，輸入命令：npminstall-g@vue/cli安裝vue3.0（-g：指全局安裝）,快捷鍵“win+r”打開運行框，輸入cmd在彈出的窗口中輸入vue-V（大寫的V哦）來檢查vue是否安裝成功。
npminstall-g@vue/cli
接下來我們繼續創建vue項目，vue3.0和2.0有點區別，不用在裝webpack了，直接使用命令：vuecreateproject創建項目（project為項目名），進入項目配置，這里選擇Manuallyselectfeatures（翻譯：手動選擇功能）。
進入下一個安裝配置選擇，這里根據項目情況自行選擇配置，按上下鍵切換目標選項，按空格鍵勾選和取消，按a全選，按i反選，選好后回車確定（以下是幾個選項的相關意義），圖中是我的選擇。
Babel：指轉譯成瀏覽器可識別的語言，可以讓你的項目支持更新的語法，如es6\es7等TypeScript：新增的選項卡ProgressiveWebApp(PWA)Support：指模擬原生appRouter：路由管理Vuex：vuex管理模式CSSPre-processors：css預處理語言Linter/Formatter：代碼規范UnitTesting：組件單元測試E2ETesting：端對端測試，模擬用戶真實場景
接下來提示我們選擇是否使用歷史路由：這種模式充分利用history.pushStateAPI來完成URL跳轉而無須重新加載頁面,我們輸入Y同意即可，然后就是選擇CSS預處理器語言，在彈出的選項中我選擇LESS
選擇ESLint的代碼規范，此處使用Standard代碼規范，這里我選擇了ESLint+Standardconfig（正常模式）
ESLintwitherrorpreventiononly:只進行報錯提醒；ESLint+Airbnbconf:不嚴謹模式；ESLint+Standardconfig:正常模式；ESLint+Prettier:嚴格模式；
接著選擇代碼檢查方式，這里提示我們何時對進行代碼檢測，我選擇在保存時進行檢測，Lintandfixoncommit（requiresGit）【翻譯：整理并固定提交時（需要git）】
接著選擇單元測試解決方案，這里選擇我Jest
接著選擇Babel、PostCSS、ESLint等配置文件存放位置，第一個保存配置文件中，第二個放package.json里，這里我選擇單獨保存在各自的配置文件中。
接著提示是否在以后的項目中使用以上配置，這里我們選擇no，下次自行配置，你也可以選擇yes。
完成以上信息配置之后開始創建項目并開始下載依賴，我們只要耐心等待進度條完成，這樣我們就把Vue項目創建好并完成了初始化。
app.vue怎么用
app.vue可以當做是網站首頁，是一個vue項目的主組件，頁面入口文件，所有頁面都是在App.vue下進行切換的。是整個項目的關鍵，app.vue負責構建定義及頁面組件歸集。
1、app.vue作為主組件在main.js中被使用。
2、主組件app.vue調用其他組件，構建頁面。
app.vue可以當做是網站首頁，也可以寫所有頁面中共同需要的動畫或者樣式，不在他上面寫代碼也可以。只要你在router文件夾中的index.js填寫好路由就ok
對應index.html,你也可以改，只不過需要在main.js哪里更改應用。說白了就就是一個普通vue文件，只不過命名為app.vue，類似于函數命名，語義化，讓人更加一目了然看到這個是#入口vue文件
app.vue是vue頁面資源的首加載項，是主組件，頁面入口文件，所有頁面都是在App.vue下進行切換的。也是整個項目的關鍵，app.vue負責構建定義及頁面組件歸集
OK，關于vue開發移動端app和vue能做app開發嗎的內容到此結束了，希望對大家有所幫助。
