1. 程式人生 > 其它 >如何使用webify快速構建Nuxt應用

如何使用webify快速構建Nuxt應用

Webify是雲開發團隊推出的一款一站式託管服務產品,這是一個專為 Web 開發者打造的雲上開發、部署平臺,幫助開發者快速開發、預覽、部署自己的 Web 應用,還支援從Github等第三方程式碼託管平臺匯入應用,為前端開發者提供極佳的服務體驗。

應用場景

靜態網站: Web 應用託管不僅支援託管靜態網站的各種資源,還對開源社群內流行的開源框架進行了適配。

單頁面應用: Web 應用託管提供自定義路由能力,支援 SPA 型別的配置,免除配置服務端的煩惱。

服務端渲染(SSR)應用: Web 應用託管對諸多開源 SSR 框架進行了適配。

後臺 Web 服務: Web 應用託管提供雲託管、雲函式兩種形式的計算能力,以滿足多種型別的後臺 Web 服務的需求。

模版建立

地址:https://cloud.tencent.com/product/webify

首先進入Web應用託管平臺,點選「新建應用」,選擇從模版建立,選擇Nuxt.js

選擇Git平臺,並填寫好倉庫名稱後,單擊「下一步」

填寫應用名稱,選擇框架預設(亦可自己自定義填寫),單擊「部署應用」

可以看到應用正在構建與部署中


首次建立應用,會下發CND配置,需要3-5分鐘才能生效

單擊應用中的連結,可以發現我們的應用可以訪問啦!

開發應用

進入到我們的GitHub倉庫後,可以發現webify在建立應用的時候,已經自動為我們建立了程式碼倉庫

git clone <romote-URL> //克隆倉庫到本地
cd <workplace-dir> //進入專案目錄
npm i //安裝相關依賴

把專案Clone到本地後,即可進行開發,在修改完後,提交至遠端 Git 倉庫,將會觸發Webify 的自動構建及部署。

git commit -m "change index.vue"
git push

可以見到我們的修改生效啦。

注意事項

有時候在提交程式碼並構建完成後,並未能見到頁面有變化,是因為CDN生效需要一些時間,稍等一會即可更新應用頁面。

詳見一鍵部署文件:https://webify.cloudbase.net/docs/guides/deploy-button

Webify官方網站:https://webify.cloudbase.net/