I’m new here to Next.js 15 and trying to link an external JavaScript script to a .tsx page in Next.js 15. Similar to how I link scripts in HTML using , I’ve attempted to include a script in Next.js, but it doesn’t seem to be working as expected. Here’s my setup:

In src/app/page.tsx:

import Image from "next/image";
import Script from "next/script";

<Script src="/components/script.js" />;

export default function Home() {
  return (
    <>
      <div>
        <p id="myText"></p>
      </div>
    </>
  );
}

And in public/components/script.js:

document.getElementById(`myText`).textContent = "Hello, this is a text";

However, the script doesn’t seem to be executing when I load the page. Is there a correct way to link and execute an external JavaScript file in Next.js, or is there any alternative method to execute JavaScript scripts in Next.js?

My apologies for this basic question.