Asset Imports

资源 URL 导入

app 文件夹中的任何文件都可以导入到您的模块中。Remix 将：

1. 将文件复制到浏览器构建目录
2. 对文件进行指纹识别以进行长期缓存
3. 将公共 URL 返回到模块，以便在渲染时使用

它最常用于样式表，但可以用于任何具有[定义的加载器] remix-loaders的文件类型。

import type { LinksFunction } from "@remix-run/node"; // or cloudflare/deno

import banner from "./images/banner.jpg";
import styles from "./styles/app.css";

export const links: LinksFunction = () => [
  { rel: "stylesheet", href: styles },
];

export default function Page() {
  return (
    <div>
      <h1>Some Page</h1>
      <img src={banner} />
    </div>
  );
}