Skip to content

nextjs/no-script-component-in-head Correctness

This rule is turned on by default.

What it does

Prevent usage of next/script in next/head component.

Why is this bad?

The next/script component should not be used in a next/head component. Instead move the <Script /> component outside of <Head> instead.

Examples

Examples of incorrect code for this rule:

jsx
import Head from "next/head";
import Script from "next/script";

export default function Index() {
  return (
    <Head>
      <title>Next.js</title>
      <Script src="/my-script.js" />
    </Head>
  );
}

Examples of correct code for this rule:

jsx
import Head from "next/head";
import Script from "next/script";

export default function Index() {
  return (
    <>
      <Head>
        <title>Next.js</title>
      </Head>
      <Script src="/my-script.js" />
    </>
  );
}

How to use

To enable this rule in the CLI or using the config file, you can use:

bash
oxlint --deny nextjs/no-script-component-in-head --nextjs-plugin
json
{
  "plugins": ["nextjs"],
  "rules": {
    "nextjs/no-script-component-in-head": "error"
  }
}

References

Released under the MIT License.