範本和堆疊

剛開始使用 Remix 嗎？最新版本的 Remix 現在是 React Router v7。如果您想使用最新的框架功能，您應該使用 React Router 範本建立您的專案。

當使用 create-remix 產生新專案時，您可以選擇範本或堆疊來快速啟動並運行。範本是讓您快速啟動並運行的最小起點。「堆疊」是更完整、更接近生產就緒架構的範本（可能包括測試、資料庫、CI 和部署配置等方面）。

範本

如果您在執行 create-remix 時未提供 --template 選項，您將獲得一個使用 Remix 應用程式伺服器的基本範本。

npx create-remix@latest

如果您對使用 TypeScript 不感興趣，您可以改為安裝更簡單的 Javascript 範本

npx create-remix@latest --template remix-run/remix/templates/remix-javascript

如果您只是想第一次嘗試 Remix，這是一個很好的起點。您可以隨時自行擴充此起點，或稍後遷移到更進階的範本。

官方範本

如果您想要更多控制您的伺服器，或希望部署到非 Node 執行階段（例如 Arc、Cloudflare 或 Deno），那麼您可以嘗試我們在 Remix 儲存庫中的官方範本之一

npx create-remix@latest --template remix-run/remix/templates/cloudflare
npx create-remix@latest --template remix-run/remix/templates/cloudflare-workers
npx create-remix@latest --template remix-run/remix/templates/express
npx create-remix@latest --template remix-run/remix/templates/remix
npx create-remix@latest --template remix-run/remix/templates/remix-javascript

## SPA Mode
npx create-remix@latest --template remix-run/remix/templates/spa

## Classic Remix Compiler
npx create-remix@latest --template remix-run/remix/templates/classic-remix-compiler/arc
npx create-remix@latest --template remix-run/remix/templates/classic-remix-compiler/cloudflare-pages
npx create-remix@latest --template remix-run/remix/templates/classic-remix-compiler/cloudflare-workers
npx create-remix@latest --template remix-run/remix/templates/classic-remix-compiler/deno
npx create-remix@latest --template remix-run/remix/templates/classic-remix-compiler/express
npx create-remix@latest --template remix-run/remix/templates/classic-remix-compiler/fly
npx create-remix@latest --template remix-run/remix/templates/classic-remix-compiler/remix
npx create-remix@latest --template remix-run/remix/templates/classic-remix-compiler/remix-javascript

第三方範本

某些託管服務供應商維護自己的 Remix 範本。如需更多資訊，請參閱下方列出的官方整合指南。

範例

我們還提供了一個社群驅動的範例儲存庫，每個範例都展示了不同的 Remix 功能、模式、工具、託管服務供應商等。您可以使用類似的方式來安裝工作範例

npx create-remix@latest --template remix-run/examples/basic

堆疊

當範本更接近成為生產就緒的應用程式時，以至於它提供了關於 CI/CD 管道、資料庫和託管平台的觀點時，Remix 社群將這些範本稱為「堆疊」。

提供了幾個官方堆疊，但您也可以製作自己的堆疊（請閱讀下文瞭解更多資訊）。

閱讀功能公告部落格文章和在 YouTube 上觀看 Remix 堆疊影片。

官方堆疊

官方堆疊已準備好您生產應用程式所需的常見內容，包括

資料庫
自動部署管道
身份驗證
測試
程式碼檢查/格式化/TypeScript

您所擁有的就是一切都已完全設定好，讓您可以開始使用 Remix 建立任何您想建構的驚人網路體驗。以下是官方的堆疊：

藍調堆疊 (The Blues Stack)：部署至邊緣 (分散式)，具有長期運行的 Node.js 伺服器和 PostgreSQL 資料庫。適用於服務數百萬用戶的大型、快速的生產級應用程式。
獨立堆疊 (The Indie Stack)：部署至具有持久性 SQLite 資料庫的長期運行 Node.js 伺服器。此堆疊非常適合具有您控制的動態資料的網站（部落格、行銷、內容網站）。它也是 MVP、原型和概念驗證的完美、低複雜度啟動程式，之後可以輕鬆更新至藍調堆疊。
垃圾搖滾堆疊 (The Grunge Stack)：部署至使用 DynamoDB 進行持久化的無伺服器函數，該函數運行 Node.js。適用於希望在 AWS 基礎架構上部署服務數百萬用戶的生產級應用程式的人員。

您可以透過在執行 create-remix 時提供 --template 選項來使用這些堆疊，例如：

npx create-remix@latest --template remix-run/blues-stack

是的，它們是以音樂類型命名的。🤘 搖滾吧。

社群堆疊

您可以在 GitHub 上瀏覽社群堆疊的清單。

社群堆疊可以透過將 GitHub 使用者名稱/儲存庫組合傳遞給執行 create-remix 時的 --template 選項來使用，例如：

npx create-remix@latest --template :username/:repo

如果您想與社群分享您的堆疊，別忘了用 remix-stack 主題標記它，以便其他人可以找到它 — 是的，我們確實建議您以音樂子類型命名您自己的堆疊（不是「搖滾」而是「獨立」！）。

其他資訊

私有範本

如果您的範本位於私有 GitHub 儲存庫中，您可以透過 --token 選項傳遞 GitHub 權杖

npx create-remix@latest --template your-private/repo --token yourtoken

該權杖只需要 repo 存取權。

本機範本

您可以將本機目錄或磁碟上的 tarball 提供給 --template 選項，例如：

npx create-remix@latest --template /my/remix-stack
npx create-remix@latest --template /my/remix-stack.tar.gz
npx create-remix@latest --template /my/remix-stack.tgz
npx create-remix@latest --template file:///Users/michael/my-remix-stack.tar.gz

自訂範本提示

相依性版本

如果您在 package.json 中將任何相依性設定為 *，Remix CLI 會將其變更為已安裝 Remix 版本的 semver caret (插入符號)

-   "remix": "*",
+   "remix": "^2.0.0",

這讓您不必定期將範本更新為該特定套件的最新版本。當然，如果您希望手動管理該套件的版本，則不必放置 *。

自訂初始化

如果範本在根目錄下有一個 remix.init/index.js 檔案，則該檔案會在專案產生且相依性已安裝後執行。這讓您可以在範本初始化時執行任何您想要的操作。例如，在藍調堆疊中，app 屬性必須是全域唯一的，因此我們使用 remix.init/index.js 檔案將其變更為為專案建立的目錄名稱 + 幾個隨機字元。

您甚至可以使用 remix.init/index.js 向開發人員詢問更多問題以進行其他設定（使用類似 inquirer 的工具）。有時，您需要安裝相依性才能執行此操作，但這些相依性僅在初始化期間有用。在這種情況下，您也可以建立具有相依性的 remix.init/package.json，Remix CLI 會在執行您的腳本之前安裝這些相依性。

執行初始化腳本後，remix.init 資料夾會被刪除，因此您不必擔心它會使完成的程式碼庫雜亂。

請注意，使用者可以選擇不執行 remix.init 腳本。要手動執行此操作，他們需要執行 remix init。