typescript - Next.js - 在建置時使用 getStaticProps 生成持久佈局

我正在使用此模式在 Next.js 中構建持久佈局：Next.js 中的持久佈局模式

當你的版面配置不依賴外部資料時，它運作正常。

如果你想建立一個類似文件頁面的頁面，而且你的佈局中有像 Getting Started、Examples、FAQ、About 這樣的側邊欄區塊，你該怎麼做？理想情況下，我希望將這些區塊存儲在 markdown 文件中，並在構建時生成佈局。

// markdown file
---
section_1: "Getting Started"
section_2: "Examples"
section_3: "FAQ"
section_4: "About"
---

如何使用 Next.JS 和 getStaticProps 實現這種功能？

答案＃1

getStaticProps 只能在頁面中使用，所以它不是生成佈局組件的選項。

你可以透過編寫自訂的 Node.js 腳本來擴展建置過程，該腳本將讀取 Markdown 並建立包含側邊欄區段的 .json 檔案。

建立的 .json 檔案可以在客戶端的 Layout 元件中匯入。

你需要在 package.json 中擴展 npm 腳本 build，這樣 next build 和你的腳本就可以用一個命令一起運行。