首先介紹下在本文出現(xiàn)的幾個(gè)比較重要的概念：

函數(shù)計(jì)算（Function Compute）: 函數(shù)計(jì)算是一個(gè)事件驅(qū)動(dòng)的服務(wù)，通過(guò)函數(shù)計(jì)算，用戶無(wú)需管理服務(wù)器等運(yùn)行情況，只需編寫(xiě)代碼并上傳。函數(shù)計(jì)算準(zhǔn)備計(jì)算資源，并以彈性伸縮的方式運(yùn)行用戶代碼，而用戶只需根據(jù)實(shí)際代碼運(yùn)行所消耗的資源進(jìn)行付費(fèi)。函數(shù)計(jì)算更多信息?參考。
Fun: Fun 是一個(gè)用于支持 Serverless 應(yīng)用部署的工具，能幫助您便捷地管理函數(shù)計(jì)算、API 網(wǎng)關(guān)、日志服務(wù)等資源。它通過(guò)一個(gè)資源配置文件（template.yml），協(xié)助您進(jìn)行開(kāi)發(fā)、構(gòu)建、部署操作。Fun 的更多文檔?參考。

備注: 本文介紹的技巧需要 Fun 版本大于等于 3.7.0。

背景

Next.js?是一種 React 的服務(wù)端渲染框架，且 Next.js 集成度極高，框架自身集成了 webpack、babel、express 等，使得開(kāi)發(fā)者可以僅依賴 Next、react、react-dom 就可以非常方便的構(gòu)建自己的 SSR React 應(yīng)用，開(kāi)發(fā)者甚至都不用像以前那樣關(guān)心路由。
Next.js 的高度集成性，使得我們很容易就能實(shí)現(xiàn)代碼分割、路由跳轉(zhuǎn)、熱更新以及服務(wù)端渲染和前端渲染。

環(huán)境準(zhǔn)備

首先按照 Fun 的?安裝文檔?里介紹的方法將 Fun 安裝到本機(jī)。
PS: 本文介紹的方法，不需要安裝 Docker，僅僅安裝 Fun 即可，最簡(jiǎn)單的方式就是直接下載可執(zhí)行的二進(jìn)制文件。
安裝完成后，可以執(zhí)行 fun --version 檢查 Fun 是否安裝成功。

快速開(kāi)始

創(chuàng)建一個(gè) Next 項(xiàng)目，這里以 nextjs 為例：

npm init next-app

進(jìn)入到剛剛創(chuàng)建的示例項(xiàng)目中：

cd nextjs

本地運(yùn)行測(cè)試該示例：

npm run dev 或者 yarn dev

效果如下：

編譯 nextjs 項(xiàng)目：

npm run build

部署項(xiàng)目到函數(shù)計(jì)算：
僅需要一個(gè)命令fun deploy，Fun 會(huì)自動(dòng)進(jìn)入部署流程，在該流程中，用戶僅僅需要按下一系列的回車(chē)即可。流程細(xì)節(jié)如下：

1. Fun 檢測(cè)到這不是一個(gè) Fun 項(xiàng)目，會(huì)提示協(xié)助創(chuàng)建（直接回車(chē)或者輸入 y 即可）: 2. Fun 項(xiàng)目自動(dòng)創(chuàng)建成功，提示是否進(jìn)行部署？可以直接回車(chē)，或者輸入 y 進(jìn)行確認(rèn)： 3. 然后 Fun 會(huì)直接將應(yīng)用部署到線上了。 部署完成后，我們可以根據(jù)部署成功的日志看到，函數(shù)計(jì)算為我們生成了臨時(shí)域名 14069166-1986114430573743.test.functioncompute.com，我們可以通過(guò)這個(gè)臨時(shí)域名直接訪問(wèn)我們剛剛部署的應(yīng)用。 **注意：臨時(shí)域名僅僅用作演示以及開(kāi)發(fā)，是有時(shí)效的，如果用作生產(chǎn)，請(qǐng)綁定已經(jīng)備案的域名，綁定自定義域名可以參考 [詳情](https://statistics.functioncompute.com/?title=%E5%BF%AB%E9%80%9F%E8%BF%81%E7%A7%BB%20Next.js%20%E5%BA%94%E7%94%A8%E5%88%B0%E5%87%BD%E6%95%B0%E8%AE%A1%E7%AE%97&author=%E7%94%B0%E5%B0%8F%E5%8D%95&src=&url=https%3A%2F%2Fhelp.aliyun.com%2Fdocument_detail%2F90722.html)**

總結(jié)

本文主要介紹了如何將 Next.js 應(yīng)用部署到函數(shù)計(jì)算。相比較與傳統(tǒng)的部署方法，不僅沒(méi)有更復(fù)雜，還省略了購(gòu)買(mǎi)機(jī)器等步驟。實(shí)現(xiàn)，將傳統(tǒng)的 Next.js 應(yīng)用在本地開(kāi)發(fā)完成后，一鍵部署到遠(yuǎn)端直接用于生產(chǎn)，并擁有了彈性伸縮、按量付費(fèi)、免運(yùn)維等特性。

“阿里巴巴云原生關(guān)注微服務(wù)、Serverless、容器、Service Mesh 等技術(shù)領(lǐng)域、聚焦云原生流行技術(shù)趨勢(shì)、云原生大規(guī)模的落地實(shí)踐，做最懂云原生開(kāi)發(fā)者的技術(shù)圈。”

原文鏈接
本文為云棲社區(qū)原創(chuàng)內(nèi)容，未經(jīng)允許不得轉(zhuǎn)載。

總結(jié)

以上是生活随笔為你收集整理的快速迁移Next.js应用到函数计算的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

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