跳转到内容

.client modules

.client 模块

虽然不常见,但您可能有一个文件或依赖项在浏览器中使用模块副作用。您可以在文件名上使用 *.client.ts 或将文件嵌套在 .client 目录中,以强制它们脱离服务器包。

feature-check.client.ts
// this would break the server
export const supportsVibrationAPI =
"vibrate" in window.navigator;

请注意,从此模块导出的值在服务器上都将是未定义的,因此唯一可以使用它们的地方是useEffect和用户事件,比如点击处理程序。

import { supportsVibrationAPI } from "./feature-check.client.ts";
console.log(supportsVibrationAPI);
// server: undefined
// client: true | false

.client 目录仅在使用 Remix Vite 时受支持。Classic Remix Compiler 仅支持 .client 文件。

请参阅侧栏中的路由模块部分以了解更多信息。