如何設置 Next.js 專案結構
Next.js 是一個很好的工具,它能為我們的 React 應用提供許多內建的功能,這些功能在 Web 應用程式中至關重要。 它只為我們的專案文件提供了一點點結構。 所有可見的頁面都放在 /pages 資料夾下。 API 路由則放在 /pages/api 資料夾下。 公開可見的文件放在 /public 資料夾下。 基本上就是這樣。其他的結構都由我們來定義。 我通常會這樣做。 所有頁面需要的 React 元件都放在 /components 資料夾下。 我通常有一個 /components/Common 資料夾,然後根據頁面結構重新創建資料夾: /components/Common /components/Home /components/Profile …以此類推。 然後我有一個 lib 資料夾,其中包含所有被 React 元件或 API 路由使用的工具程式。這可能是資料獲取、庫初始化、Prisma 設置、資料庫存取、SWR 的請求器、easy-peasy store 等等,基本上任何在任何地方都可以重複使用的東西,但卻不是元件。 我也確保可以這樣引入它們: import comp from components/Common/comp import x from lib/x 使用 jsconfig.json 中的以下設定進行設置: { "compilerOptions": { "baseUrl": "." } } 我提到了我常常使用的 Prisma。這將需要它自己的 /prisma 資料夾,用於存放模式和遷移,如果需要的話,還可以有一個 SQLite 數據庫。 如果網站有內容(例如 Markdown),我會新增一個 /content 資料夾。...