Node 24 Dynamic import missing file extension

[pd8]

Versions

• @prismicio/next: 2.2.1
• next: 13.X/14.X/15.x
• node: v24+

Reproduction

In Node v24 ESM requires imports to reference imports with extensions
Now the ESM release for @prismicio/next has been released, trying to do the dynamic import of next/navigation means the file cannot be found, as it should be next/navigation.js (to my understanding)

Additional Details

Steps to reproduce

Use node 24, with Prismicio/next
Try to perform

What is expected?

Import the file successfully

What is actually happening?

Error [ERR_MODULE_NOT_FOUND]: Cannot find module '/*/node_modules/next/navigation' imported from /*/node_modules/@prismicio/next/dist/PrismicPreviewClient.js
Did you mean to import "next/navigation.js"?
    at finalizeResolution (node:internal/modules/esm/resolve:274:11)
    at moduleResolve (node:internal/modules/esm/resolve:864:10)
    at defaultResolve (node:internal/modules/esm/resolve:990:11)
    at #cachedDefaultResolve (node:internal/modules/esm/loader:718:20)
    at #resolveAndMaybeBlockOnLoaderThread (node:internal/modules/esm/loader:735:38)
    at ModuleLoader.resolveSync (node:internal/modules/esm/loader:764:52)
    at #resolve (node:internal/modules/esm/loader:700:17)
    at ModuleLoader.getOrCreateModuleJob (node:internal/modules/esm/loader:620:35)
    at ModuleJob.syncLink (node:internal/modules/esm/module_job:143:33)
    at ModuleJob.link (node:internal/modules/esm/module_job:228:17)
    at new ModuleJob (node:internal/modules/esm/module_job:207:26)
    at #getOrCreateModuleJobAfterResolve (node:internal/modules/esm/loader:589:11)
    at afterResolve (node:internal/modules/esm/loader:624:52)
    at ModuleLoader.getOrCreateModuleJob (node:internal/modules/esm/loader:630:12)
    at ModuleJob.syncLink (node:internal/modules/esm/module_job:143:33) {
  code: 'ERR_MODULE_NOT_FOUND',
  url: 'file://*/node_modules/next/navigation',
  page: '/*'
}

With next failing to build the page because of the import exception

[angeloashmore]

Hi @pd8, thanks for the report.

Are you using @prismicio/next, or a file that imports @prismicio/next, in your Next.js config file? An example could be importing your Prismic client from prismicio.ts, which itself imports @prismicio/next.

If not, could you describe how and where you are using @prismicio/next?

[pd8]

I'm using @prismicio/next directly, but not in my nextjs config file
This issue occurs when importing from @prismicioio/next, like so:

(Giving just a simple example)

import { PrismicNextLink } from '@prismicio/next';

export default () => (
    <div>
        <PrismicNextLink
            href={...}
        />
    </div>
)

Apologies I know I mentioned above about a dynamic import, but on second look of the dist of prismicio/next, I can't see a dynamic import, only a static import of import { useRouter } from "next/navigation"; which when I modify to have a .js on the end, the error changes to something else (which may or may not be related to this initial bug and I haven't looked deeply into)

If I remove all references to @prismicio/next, and replace them with say, next/link, I don't have the issue, meaning my current version of @prismicio/react does not have this problem (which I believe IS compiling to esm?)

[pd8]

Hi @angeloashmore I was just wondering if there's anything else that could be useful, or if you've managed to replicate?

[angeloashmore]

Hi @pd8, sorry for the delay. ESM/CJS issues have been difficult to handle, but I think I found a fix. Could you test this prerelease version and let me know if it fixes your issue?

npm install @prismicio/next@pr-130

You can find details on the prerelease changes here: #130.