uni-app 1.2釋出，iOS、Android、小程式、H5主流四端全覆蓋

技術 · 發表 2018-11-27 19:11:35

摘要：多端氾濫、精力有限，是很多前端開發者每日的夢魘。 uni-app 遵循 Vue.js 語法規範，一套程式碼，多端發行，切實解決了眾多開發者的痛點；故自8月份釋出以來，已有上萬名開發人員擁抱 uni-app ，目前已累計建立了數萬個應用，活躍的開發者們每天在QQ群中產生數萬條交流...

多端氾濫、精力有限，是很多前端開發者每日的夢魘。

uni-app 遵循 Vue.js 語法規範，一套程式碼，多端發行，切實解決了眾多開發者的痛點；

故自8月份釋出以來，已有上萬名開發人員擁抱 uni-app ，目前已累計建立了數萬個應用，活躍的開發者們每天在QQ群中產生數萬條交流記錄。

奔跑的腳步不會停止，歷時一個多月的打磨， uni-app 1.2版本正式釋出，支援發行到H5平臺。

至此， uni-app 實現了iOS、Android、小程式、H5 主流四端 全覆蓋！

另外， uni-app 自1.2版本開始，正式開源( ofollow,noindex">傳送門 )，歡迎大家 star 鼓勵。

掃碼體驗

例項說話，依次掃描如下4個二維碼，對比體驗一下：

注：Appstore不能提交簡單demo，所以iOS版補充了一些其他功能。

uni-app 支援通過 HBuilderX 視覺化介面、 vue-cli 命令列兩種方式快速建立專案，兩種模式執行到H5平臺後，都支援熱過載。

視覺化的方式比較簡單，HBuilderX內建處理了相關環境依賴，適合懶人操作。

1.下載HBuilderX（地址），並安裝、啟動

2.新建專案，選擇 uni-app 型別，並選擇 Hello uni-app 模板

3.點選頂部選單，執行到chrome瀏覽器

4.之後HBuilderX開始編譯，並將資訊輸出到控制檯

5.編譯完成後，HBuilderX會自動開啟chrome瀏覽器並載入H5頁面

Tips:

習慣 cli 腳手架的同學，可以通過 vue-cli 建立 uni-app 專案。

1.全域性安裝vue-cli

npm install -g @vue/cli
複製程式碼

2.建立uni-app專案

vue create -p dcloudio/uni-preset-vue my-project
複製程式碼

此時，會提示選擇專案模板，初次體驗建議選擇 hello uni-app 專案模板，如下所示：

3.進入目錄並執行

cd my-project
npm run serve
複製程式碼

執行成功後，控制檯會輸出H5網站訪問地址，如下：

4.啟動chromel瀏覽器並切換為手機除錯模式，訪問如上地址即可體驗。

Tips：

cli
src

uni-app 在發行到H5端時，採用的是SPA模式，支援下列配置：

uni-app 1.2版本，還包括如下更新：