Remix 通常将您的服务器代码构建成一个捆绑包,该捆绑包公开单个请求处理程序函数。但是,在某些情况下,您可能希望将路由树拆分为多个服务器捆绑包,这些捆绑包为部分路由公开请求处理程序函数。为了提供这种灵活性,Remix Vite 插件 支持一个 serverBundles
选项,该选项是一个用于将路由分配到不同服务器捆绑包的函数。
提供的 serverBundles
函数会为树中的每个路由(除了不可寻址的路由,例如无路径布局路由)调用,并返回您想要为其分配的服务器捆绑包 ID。这些捆绑包 ID 将用作服务器构建目录中的目录名称。
对于每个路由,此函数都会传递一个通往该路由(包括该路由)的路由数组,称为路由 branch
。这允许您为路由树的不同部分创建服务器捆绑包。例如,您可以使用它为特定布局路由内的所有路由创建单独的服务器捆绑包。
import { vitePlugin as remix } from "@remix-run/dev";
import { defineConfig } from "vite";
export default defineConfig({
plugins: [
remix({
serverBundles: ({ branch }) => {
const isAuthenticatedRoute = branch.some((route) =>
route.id.split("/").includes("_authenticated")
);
return isAuthenticatedRoute
? "authenticated"
: "unauthenticated";
},
}),
],
});
branch
数组中的每个 route
都包含以下属性
id
— 此路由的唯一 ID,命名方式与其 file
相同,但相对于应用程序目录且没有扩展名,例如 app/routes/gists.$username.tsx
的 id
为 routes/gists.$username
。path
— 此路由用于匹配 URL 路径名的路径。file
— 此路由入口点的绝对路径。index
— 此路由是否为索引路由。构建完成后,Remix 将调用 Vite 插件的 buildEnd
钩子,并传递一个 buildManifest
对象。如果您需要检查构建清单以确定如何将请求路由到正确的服务器捆绑包,这将非常有用。
import { vitePlugin as remix } from "@remix-run/dev";
import { defineConfig } from "vite";
export default defineConfig({
plugins: [
remix({
// ...
buildEnd: async ({ buildManifest }) => {
// ...
},
}),
],
});
使用服务器捆绑包时,构建清单包含以下属性
serverBundles
— 一个对象,将捆绑包 ID 映射到捆绑包的 id
和 file
。routeIdToServerBundleId
— 一个对象,将路由 ID 映射到其服务器捆绑包 ID。routes
— 一个路由清单,将路由 ID 映射到路由元数据。这可用于驱动 Remix 请求处理程序前面的自定义路由层。或者,您可以在 Vite 插件上启用 manifest
选项,以将此构建清单对象写入磁盘作为构建目录中的 .remix/manifest.json
。