output
在建置期間,Next.js 將自動追蹤每個頁面及其相依性,以判斷部署應用程式生產版本所需的所有檔案。
此功能有助於大幅縮減部署大小。 過去,當使用 Docker 部署時,您需要安裝套件dependencies
中的所有檔案才能執行 next start
。 從 Next.js 12 開始,您可以利用 .next/
目錄中的輸出檔案追蹤,僅包含必要的檔案。
此外,這也消除了對已棄用的 serverless
目標的需求,該目標可能會導致各種問題,並產生不必要的重複。
運作方式
在 next build
期間,Next.js 將使用 @vercel/nft
靜態分析 import
、require
和 fs
的用法,以判斷頁面可能載入的所有檔案。
Next.js 的生產伺服器也會追蹤其所需的檔案,並在 .next/next-server.js.nft.json
輸出,以便在生產環境中利用。
為了利用發射到 .next
輸出目錄的 .nft.json
檔案,您可以讀取每個追蹤中相對於 .nft.json
檔案的檔案清單,然後將它們複製到您的部署位置。
自動複製追蹤的檔案
Next.js 可以自動建立一個 standalone
資料夾,其中僅複製生產部署所需的必要檔案,包括 node_modules
中的選定檔案。
若要利用此自動複製功能,您可以在 next.config.js
中啟用它
module.exports = {
output: 'standalone',
}
這將在 .next/standalone
建立一個資料夾,然後可以單獨部署該資料夾,而無需安裝 node_modules
。
此外,還會輸出一個最小的 server.js
檔案,可以用來代替 next start
。 這個最小伺服器預設不會複製 public
或 .next/static
資料夾,因為這些資料夾理想情況下應該由 CDN 處理,儘管這些資料夾可以手動複製到 standalone/public
和 standalone/.next/static
資料夾,之後 server.js
檔案將自動提供這些資料夾。
若要手動複製這些檔案,您可以在 next build
之後使用 cp
命令列工具
cp -r public .next/standalone/ && cp -r .next/static .next/standalone/.next/
若要在本機啟動您的最小 server.js
檔案,請執行以下命令
node .next/standalone/server.js
要知道的好資訊:
- 如果您的專案需要監聽特定埠號或主機名稱,您可以在執行
server.js
之前定義PORT
或HOSTNAME
環境變數。 例如,執行PORT=8080 HOSTNAME=0.0.0.0 node server.js
以在http://0.0.0.0:8080
上啟動伺服器。
注意事項
- 在 monorepo 設定中追蹤時,專案目錄預設用於追蹤。 對於
next build packages/web-app
,packages/web-app
將是追蹤根目錄,並且不會包含該資料夾外的任何檔案。 若要包含此資料夾外的檔案,您可以在next.config.js
中設定outputFileTracingRoot
。
module.exports = {
// this includes files from the monorepo base two directories up
outputFileTracingRoot: path.join(__dirname, '../../'),
}
- 在某些情況下,Next.js 可能無法包含必要的檔案,或可能錯誤地包含未使用的檔案。 在這些情況下,您可以分別在
next.config.js
中利用outputFileTracingExcludes
和outputFileTracingIncludes
。 每個設定都接受一個物件,其中包含 minimatch globs 作為鍵,以比對特定頁面,以及一個陣列的值,其中包含相對於專案根目錄的 globs,以包含或排除在追蹤中。
module.exports = {
outputFileTracingExcludes: {
'/api/hello': ['./un-necessary-folder/**/*'],
},
outputFileTracingIncludes: {
'/api/another': ['./necessary-folder/**/*'],
'/api/login/\\[\\[\\.\\.\\.slug\\]\\]': [
'./node_modules/aws-crt/dist/bin/**/*',
],
},
}
注意: outputFileTracingIncludes
/outputFileTracingExcludes
的鍵是一個 glob,因此特殊字元需要逸出。
- 目前,Next.js 不會對發射的
.nft.json
檔案執行任何操作。 這些檔案必須由您的部署平台讀取,例如 Vercel,以建立最小部署。 在未來的版本中,計劃使用這些.nft.json
檔案的新命令。
實驗性 turbotrace
追蹤相依性可能很慢,因為它需要非常複雜的計算和分析。 我們在 Rust 中建立了 turbotrace
,作為 JavaScript 實作的更快且更聰明的替代方案。
若要啟用它,您可以將以下設定新增至您的 next.config.js
module.exports = {
experimental: {
turbotrace: {
// control the log level of the turbotrace, default is `error`
logLevel?:
| 'bug'
| 'fatal'
| 'error'
| 'warning'
| 'hint'
| 'note'
| 'suggestions'
| 'info',
// control if the log of turbotrace should contain the details of the analysis, default is `false`
logDetail?: boolean
// show all log messages without limit
// turbotrace only show 1 log message for each categories by default
logAll?: boolean
// control the context directory of the turbotrace
// files outside of the context directory will not be traced
// set the `outputFileTracingRoot` has the same effect
// if the `outputFileTracingRoot` and this option are both set, the `experimental.turbotrace.contextDirectory` will be used
contextDirectory?: string
// if there is `process.cwd()` expression in your code, you can set this option to tell `turbotrace` the value of `process.cwd()` while tracing.
// for example the require(process.cwd() + '/package.json') will be traced as require('/path/to/cwd/package.json')
processCwd?: string
// control the maximum memory usage of the `turbotrace`, in `MB`, default is `6000`.
memoryLimit?: number
},
},
}
這有幫助嗎?