검색되지 않은 TypeError: 정의되지 않은 속성을 읽을 수 없음('_H' 읽기)

검색되지 않은 TypeError: 정의되지 않은 속성을 읽을 수 없음('_H' 읽기)

나는 Preact + Vite + Typecript + Redex를 사용하여 간단한 Todo 앱을 만들려고 한다.하지만 나는 환원기와 형식에 대한 호환성 문제에 직면해 있다.

이게 내가 받고 있는 오류야.

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)

vite.config.ts에서 사전 호환성을 위해 앨리어싱된 reaction & react-dom을 사용한다.

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

여기 내 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!
);

꾸러미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"
  },
 ...
}

비슷한 오류가 몇 시간 동안 머리를 긁적거렸고 나중에 내가 사용하고 있다는 것을 깨달았다.useEffect내 컴포넌트 안에 수입물량이 몇 개 없어 eslint가 나에게 누락된 모듈을 자동으로 가져오라고 요구했고, 나는 그렇게 했고, 편집기에 오류가 없어서 어디에서 모듈을 가져왔는지 확인하지 않았지만 나중에 빌드 과정에서 eslint가 수입한 것을 깨달았다.useEffect아래 그림과 같이

import { useEffect } from "preact/compat"

참조URL: https://stackoverflow.com/questions/69140819/uncaught-typeerror-cannot-read-properties-of-undefined-reading-h