Type '{}' is not assignable to type 'ReactNode' ---- type error of monorepo with both react@17 and @18
react18-type: import("@types+react@18.0.x/node_modules/@types/react")
react17-type: import("@types+react@17.0.x/node_modules/@types/react")
react18-type assign to react17-type ✅
react17-type assign to react18-type ❌
Type '{}' is not assignable to type 'ReactNode'.
@types/react@17 -> @18 有 breaking
而 react 中社区中很多包都依赖了 dependencies "@types/react": "*"
,造成 resolve依赖时,会拿到该monorepo下最新的 @types/react
- 全局 overrides, 如果你们的monorepo下都使用 react17 的功能,而没有用 react18 的功能可以使用
全局统一一个 type 包,对整体的monorepo的影响理论上来说是极小
// <workspace-root>/package.json
"pnpm":{
"@types/react": "17.0.xx"
}
- 使用 tsconfig path hack一下,指向 @types/react ,在 webpack alias 中再指回来
子项目维度下,影响很小
// tsconfig.json
{
"paths": {
"react": ["./node_modules/@types/react"]
}
}
// webpack.config.js
module.exports = {
resolve: {
alias: {
react: path.resolve(__dirname, './node_modules/react')
}
}
}
相关 issue:
DefinitelyTyped/DefinitelyTyped/pull/56210
官方解决方案: