Uncaught TypeError: Cannot read properties of undefined (reading '__H') when using Preact with react-redux Provider API

I’m trying to build a simple Todo App using Preact + Vite + Typescript + Redux.

This is the error I’m getting when using react-redux Provider API to connect ReduxToolkit store with my <App>.

You can check out my GitHub repo here - https://github.com/greatvivek11/TodoApp But this code has not been pushed there.

Uncaught TypeError: Cannot read properties of undefined (reading '__H')
    at m (react-redux.064eb876.js:3)
    at d (react-redux.064eb876.js:3)
    at d.Provider [as constructor] (react-redux.064eb876.js:1165)
    at d.L [as render] (index.js:506)
    at $ (index.js:178)
    at m (children.js:147)
    at $ (index.js:195)
    at m (children.js:147)
    at $ (index.js:195)
    at M (render.js:36)

I have aliased react & react-dom in vite.config.ts to preact-compat. vite.config.ts

export default defineConfig(
  {
  esbuild: {
    jsxFactory: 'h',
    jsxFragment: 'Fragment',
  },
  alias:
    [
       {find: 'react', replacement: 'preact/compat'},
       {find: 'react-dom', replacement: 'preact/compat'},
    ],
  plugins: [
    preactRefresh()
  ],
});

Here is my tsconfig.json

{
  "compilerOptions": {
    ...
    "paths": {
      "react": ["node_modules/preact/compat"],
      "react-dom": ["node_modules/preact/compat"]
    }
  },
  "include": ["src", "service-worker.js"]
}

main.tsx

serviceWorker.register();
render(
    <Provider store={store}>
        <App />
    </Provider>,
    document.body!
);

package.json

{
  ...
  "dependencies": {
    "@reduxjs/toolkit": "^1.6.1",
    "preact": "^10.5.10",
    "react-redux": "^7.2.4"
  },
  "devDependencies": {
    "@prefresh/vite": "^2.0.1",
    "@tailwindcss/typography": "^0.3.1",
    "@types/node": "^16.4.8",
    "@typescript-eslint/eslint-plugin": "^4.14.0",
    "@typescript-eslint/parser": "^4.14.0",
    "autoprefixer": "^10.2.1",
    "cross-env": "^7.0.3",
    "dotenv": "^10.0.0",
    "postcss-import": "^14.0.2",
    "prettier": "^2.2.1",
    "tailwindcss": "^2.0.2",
    "typescript": "^4.1.3",
    "vite": "^2.0.0-beta.31"
  },
 ...
}

[alexsorokoletov]

We’re getting the exact same error message and it seems to be related to the useEffect hook: The minified useEffect hook from preact package:

function y2(r5, o4) {
  var i5 = m2(t2++, 3);
  !n.__s && k2(i5.__H, o4) && (i5.__ = r5, i5.__H = o4, u2.__H.__h.push(i5));
}

[JoviDeCroock]

Just tried this which seems to all work correctly, this might be an issue with your bundle producing multiple copies of Preact, working example closing until we have a way to reproduce this.