别名反应为 preact throws Cannot find module: 'react/jsx-runtime'

Question

不要使用我链接的指南，它是旧的 - 请改用答案中的指南

我正在尝试通过 following their guide 从 React 切换到 Preact。我更改 webpack.config.js 别名以添加：

  alias: {
    "react": "preact-compat",
    "react-dom": "preact-compat",
    .....

但是当我运行 npm run build 我不断得到：

Failed to compile.

.\src\index.tsx
Cannot find module: 'react/jsx-runtime'. Make sure this package is installed.

我试过：

按照此处的建议更改 tsconfig：create-react-app typescript won't run npm start。似乎没有帮助。我最终将其保留为原始版本："jsx": "react-jsx"
确认我的依赖项是最新的：

"@types/node": "^14.14.35",

"@types/react": "^17.0.3",

"@types/react-dom": "^17.0.3",

"打字稿": "^4.2.3",
删除并重新安装 node_modules
正在将 index.js 转换为 index.tsx
像这样向 package.json 添加 preact 导出 github 建议：https://github.com/babel/babel/issues/12210#issuecomment-712043796

当我注释掉 preact 指南中的别名更改时，一切正常。很高兴提供更多信息，但我不确定什么是相关的。

这是来自 npm 运行构建的详细错误日志：

13 verbose stack Error: website@0.2.5 build: `node scripts/build.js`
13 verbose stack Exit status 1
13 verbose stack     at EventEmitter.<anonymous> (C:\Program Files\nodejs\node_modules\npm\node_modules\npm-lifecycle\index.js:332:16)
13 verbose stack     at EventEmitter.emit (events.js:315:20)
13 verbose stack     at ChildProcess.<anonymous> (C:\Program Files\nodejs\node_modules\npm\node_modules\npm-lifecycle\lib\spawn.js:55:14)
13 verbose stack     at ChildProcess.emit (events.js:315:20)
13 verbose stack     at maybeClose (internal/child_process.js:1048:16)
13 verbose stack     at Process.ChildProcess._handle.onexit (internal/child_process.js:288:5)

Answer 1

您似乎指的是过时的文档页面。这是 latest one.

您应该改用 preact/compat：

alias: {
  "react": "preact/compat",
  "react-dom": "preact/compat",
  ...

别名反应为 preact throws Cannot find module: 'react/jsx-runtime'

Aliasing react as preact throws Cannot find module: 'react/jsx-runtime'

typescript

reactjs

preact

create-react-app