Version 18 incompatible with Next.js

[HofmannZ]

Due to the move to ESM this package has become incompatible with Next.js.

Next.js recommends setting up projects with TypeScript. However the TypeScript configuration required by this package if incompatible with Next.js because Next.js does not support "module": "nodenext" nor "module": "node16".

This pakcage reccomends the following TypeScript config:

Projects must configure TypeScript to use types from the ECMAScript modules that have a // @ts-check comment:

compilerOptions.allowJs should be true. compilerOptions.maxNodeModuleJsDepth should be reasonably large, e.g. 10. compilerOptions.module should be "node16" or "nodenext".

When running the Next.js with the reccomended config provided in this package you will get the following message:

   ▲ Next.js 14.0.4
   - Local:        http://localhost:3000
   - Environments: .env


   We detected TypeScript in your project and reconfigured your tsconfig.json file for you. Strict-mode is set to false by default.
   The following mandatory changes were made to your tsconfig.json:

        - moduleResolution was set to node (to match webpack resolution)

[yohimik]

up it doesn't work at all in my environment, I get such an error

Module not found: Package path . is not exported from package ./node_modules/apollo-upload-client (see exports field in ./node_modules/apollo-upload-client/package.json)

[yutasuzuki]

@yohimik Changed to individual module imports.

import createUploadLink from 'apollo-upload-client/createUploadLink.mjs'

[jaydenseric]

It's really unacceptable that Next.js doesn't support very well the most modern and correct TypeScript module resolution mode that the TypeScript team themself recommend using; nodenext. Instead of raising an issue here about it, you should press Next.js in their issues to fix the bugs with Next.js.

At work when I use Next.js with a mix of pure ESM and faux ESM (e.g. ESM without using .mjs and missing file extensions in import paths) dependencies, I configure TypeScript with (in addition to other stuff, just pointing out these 2 settings):

{
  "compilerOptions": {
    "module": "esnext",
    "moduleResolution": "bundler"
  }
}