`<Scripts />`

此组件渲染应用的客户端运行时。你应该将其渲染到 HTML 的 <body> 组件中，通常是在 app/root.tsx 组件中。

¥This component renders the client runtime of your app. You should render it inside the <body> of your HTML, usually in app/root.tsx.

import { Scripts } from "@remix-run/react";

export default function Root() {
  return (
    <html>
      <head />
      <body>
        <Scripts />
      </body>
    </html>
  );
}

如果你不渲染 <Scripts/> 组件，你的应用仍将像传统的没有 JavaScript 的 Web 应用一样工作，仅依赖于 HTML 和浏览器行为。

¥If you don't render the <Scripts/> component, your app will still work like a traditional web app without JavaScript, relying solely on HTML and browser behaviors.

属性

¥Props

<Scripts> 组件可以将某些属性传递给底层 <script> 标签，例如：

¥The <Scripts> component can pass through certain attributes to the underlying <script> tags such as:

<Scripts crossOrigin> 用于将你的静态资源托管在与应用不同的服务器上。

¥<Scripts crossOrigin> for hosting your static assets on a different server than your app.
<Scripts nonce> 支持将脚本的内容安全策略和 nonce-sources 用作 <script> 标签。

¥<Scripts nonce> to support a content security policy for scripts with nonce-sources for your <script> tags.

你无法传递 async/defer/src/type/noModule 等属性，因为它们由 Remix 内部管理。

¥You cannot pass through attributes such as async/defer/src/type/noModule because they are managed by Remix internally.