preact: Build fails when using hooks

Fixed with #1425 🎉

Using Rollup can build.

Hi @flppv! This is most likely an issue with Webpack’s handling of JS Modules. It might be worth trying out this webpack plugin to see if that fixes the production build.

Any chance you could set up a reproduction? I’ll be trying, but it’d be great if you had something handy.

Did you ever solve this? Similar issue with Parcel

As @gautam1168 mentioned Cannot read property '__H' of undefined" can be happening because of different versions. Sometimes even preact/debug can’t catch it.

In my case it was because it was monorepo and packages had different versions.

This was fixed for me by installing preact-cli@rc

If #1331 is the same error, then it has a repro at https://github.com/weijarz/preact-x-bug-r-is-undefined

Hey, I had the exact same issue (in a CRA app), and the plugin suggested by @developit fixes the error 😃

I made a repo showing how to use Preact with a variety of bundlers (webpack, rollup, vite, rspack, parcel): https://github.com/andrewiggins/preact-bundling

All of them work with preact/hooks using a basic Counter example. If you are still having issues, please create a new issue with a repro that we can use to determine what is done differently from these examples to help debug the issue.

Hey @kaidoj would be best if you could share/create a repo with the issue. I’m recommending the repo just because it’s gonna be easier to properly run the build.

Due to their functional nature they can be used in functional components and avoid many pitfalls of the […] https://preactjs.com/guide/v10/hooks

With the above text, it boils down to:

* Use hooks only inside functional component

* Here's an example https://preactjs.com/guide/v10/hooks#usereducer

Seems that you’re using useReducer outside of a class based component. Can you amend the above and see if it works?

Hey @cristianbote ! I can confirm that this was it. I missed that sentence in documentation. Thank you for pointing this out. Everything is working fine now.

Hey @kaidoj would be best if you could share/create a repo with the issue. I’m recommending the repo just because it’s gonna be easier to properly run the build.

Due to their functional nature they can be used in functional components and avoid many pitfalls of the […] https://preactjs.com/guide/v10/hooks

With the above text, it boils down to:

• Use hooks only inside functional component
• Here’s an example https://preactjs.com/guide/v10/hooks#usereducer

Seems that you’re using useReducer outside of a class based component. Can you amend the above and see if it works?