"no exported member" errors when using NodeNext module/moduleResolution in TypeScript

[bhouston]

I ran into this bug and it took a while to figure out. It turns out that this library (as well as threes-stdlib) are not compatible with "NodeNext" module/moduleResolution, e.g. if you tsconfig.json looks like this:

    "module": "NodeNext",
    "moduleResolution": "NodeNext",

And you try to use this library like this:

Code:

import {
  EffectComposer,
  LensFlare,
  Vignette,
  Bloom,
} from "@react-three/postprocessing";

You will get compile errors via TSC like this:

src/Scene.tsx:11:3 - error TS2305: Module '"@react-three/postprocessing"' has no exported member 'EffectComposer'.
src/Scene.tsx:12:3 - error TS2305: Module '"@react-three/postprocessing"' has no exported member 'LensFlare'.
src/Scene.tsx:13:3 - error TS2305: Module '"@react-three/postprocessing"' has no exported member 'Vignette'.
src/Scene.tsx:14:3 - error TS2305: Module '"@react-three/postprocessing"' has no exported member 'Bloom'.

You can work around the bug by switching your tsconfig.json to something like this instead:

    "module": "ESNext",
    "moduleResolution": "Node",

I suspect there is some way to fix this? But I do not yet know. One clue is that @react-three/fiber and @react-three.drei work properly with these tsconfig.json settings.