模板
本页

模板和栈

当使用 create-remix 生成新项目时,可以选择一个模板或一个栈来快速启动和运行。模板是帮助你快速启动和运行的最小起点。“栈”是更完整且更接近生产就绪架构的模板(可能包括测试、数据库、CI 和部署配置等方面)。

模板

如果在不提供 --template 选项的情况下运行 create-remix,则将获得使用 Remix 应用服务器 的基本模板。

npx create-remix@latest

如果你不想使用 TypeScript,可以改为安装更简单的 Javascript 模板。

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

如果你只是想第一次尝试 Remix,这是一个很好的起点。你始终可以自己扩展此起点,或稍后迁移到更高级的模板。

官方模板

如果你希望更好地控制你的服务器或希望部署到非节点运行时(例如 ArcCloudflareDeno),那么你可以尝试 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 Stacks 视频

官方栈

官方栈附带了生产应用程序所需的常见内容,包括

  • 数据库
  • 自动部署管道
  • 身份验证
  • 测试
  • 代码风格检查/格式化/TypeScript

剩下的就是一切为你完全设置好,你只需开始使用 Remix 构建任何你想要构建的令人惊叹的 Web 体验。以下是一些官方栈:

  • Blues 栈:部署到边缘(分布式),带有长期运行的 Node.js 服务器和 PostgreSQL 数据库。适用于为数百万用户提供服务的庞大且快速的生产级应用程序。
  • Indie Stack:部署到一个长期运行的 Node.js 服务器,并使用持久化的 SQLite 数据库。此栈非常适合您控制的具有动态数据的网站(博客、营销、内容网站)。它也是 MVP、原型和概念验证的完美低复杂度启动方案,稍后可以轻松更新到 Blues Stack。
  • Grunge Stack:部署到运行 Node.js 的无服务器函数,并使用 DynamoDB 进行持久化。适用于希望在 AWS 基础设施上部署面向数百万用户的生产级应用程序的用户。

您可以通过在运行 create-remix 时提供 --template 选项来使用这些栈,例如

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

是的,这些名称来自音乐类型。🤘 摇滚万岁。

社区栈

您可以在 GitHub 上浏览社区栈列表

社区栈可以通过在运行 create-remix 时将 GitHub 用户名/仓库组合传递给 --template 选项来使用,例如

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

如果您想与社区分享您的栈,请不要忘记使用 remix-stack 主题进行标记,以便其他人可以找到它——是的,我们确实建议您以音乐子类型(不是“摇滚”而是“独立”!)为您的栈命名。

其他信息

私有模板

如果您的模板位于私有 GitHub 仓库中,您可以通过 --token 选项传递 GitHub 令牌

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

令牌只需要 repo 访问权限

本地模板

您可以向 --template 选项提供磁盘上的本地目录或 tarball,例如

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 版本的语义版本号插入符号

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

这使您无需定期将模板更新到该特定包的最新版本。当然,如果您希望手动管理该包的版本,则不必使用 *

自定义初始化

如果模板在根目录下有 remix.init/index.js 文件,则该文件将在项目生成并安装依赖项后执行。这使您有机会在模板初始化过程中执行任何您想执行的操作。例如,在 Blues Stack 中,app 属性必须全局唯一,因此我们使用 remix.init/index.js 文件将其更改为为项目创建的目录的名称加上几个随机字符。

您甚至可以使用 remix.init/index.js 向开发人员询问其他配置信息(使用类似 inquirer 的工具)。有时,您需要安装依赖项才能执行此操作,但这些依赖项仅在初始化期间有用。在这种情况下,您还可以创建一个包含依赖项的 remix.init/package.json,Remix CLI 将在运行脚本之前安装这些依赖项。

初始化脚本运行后,remix.init 文件夹将被删除,因此您无需担心它会使完成的代码库混乱。

请注意,使用者可以选择不运行 remix.init 脚本。要手动执行此操作,他们需要运行 remix init

文档和示例已获得以下许可 MIT