.client
模块¥.client
modules
虽然不常见,但你的文件或依赖可能会在浏览器中使用模块副作用。你可以在文件名上使用 *.client.ts
,或将文件嵌套在 .client
目录中,以强制它们脱离服务器包。
¥While uncommon, you may have a file or dependency that uses module side effects in the browser. You can use *.client.ts
on file names or nest files within .client
directories to force them out of server bundles.
// this would break the server
export const supportsVibrationAPI =
"vibrate" in window.navigator;
请注意,从此模块导出的值在服务器上都将是 undefined
,因此唯一可以使用它们的地方是在 useEffect
和用户事件(例如点击处理程序)中。
¥Note that values exported from this module will all be undefined
on the server, so the only places to use them are in useEffect
and user events like click handlers.
import { supportsVibrationAPI } from "./feature-check.client.ts";
console.log(supportsVibrationAPI);
// server: undefined
// client: true | false
.client
目录仅在使用 Remix Vite 时受支持。Classic Remix 编译器 仅支持 .client
文件。
有关更多信息,请参阅侧边栏中的路由模块部分。
¥Refer to the Route Module section in the sidebar for more information.