Preact: Babel ^7.12.0 breaks preact jsx-runtime export

[johakr]

Hi,

due to this change in babel https://github.com/babel/babel/pull/12116/commits/d6b0822ee9e95321a417b321a6687048faf1c3a1, the preact jsx runtime can't be imported anymore. Preact exports the jsx-runtime as folder, but babel expects a file with file ending .js now (${source}/jsx-runtime.js and ${source}/jsx-dev-runtime.js).

Module not found: Error: Can't resolve 'preact/jsx-runtime.js'

Is that something we should address at the babel repo, or do we need to change how the runtime is exported in preact?

[nicolo-ribaudo]

Fixed in @babel/[email protected]

[rati-dzidziguri]

any ideas on how to fix this I am getting the same error
Module not found: Can't resolve 'react/jsx-dev-runtime' and using preact 10.5.7 with craco.

[nicolo-ribaudo]

@rati-dzidziguri

You need to pass "importSource": "preact" to the JSX plugin/preset.

[rati-dzidziguri]

@nicolo-ribaudo, thank you very much. Would you please provide a little more details on which plugin to install and how to do this? Highly appreciate this answer.

[nicolo-ribaudo]

I'm not sure about your setup (or the default build setup for Preact), but there is _already_ something compiling JSX in your build process (either TS, or Babel): you need to find this existing tool and update its config.

[rati-dzidziguri]

I understand; thank you very much. here are my package JSON and configs.

craco.config.js

I have no other customizations, but this and initially used CRA to create the base skeleton.

[developit]

I'm guessing this is something strange "craco" is doing.