react-native-css/metro's declarations import react-native, loading React Native's globals into a Node program

未关闭 适合新手
  • 哪里不对？
#549 2 条评论 0 个 reaction 已指派 0 人 在 GitHub 查看

维护者通常 5 天内回复

还没有人认领这个 Issue。

评估

难度
2/5
预计耗时
1-3 小时
新手友好度
70/100
Issue 类型
缺陷
描述清晰度
基本清楚
活跃度
活跃
技术栈
node.js, react-native, typescript
领域
tooling

调研方向

从 src/compiler/compiler.types.ts（第 8 行）和 src/native/reactivity.ts（第 1-8 行）开始，查看 VAR_SYMBOL 引入 react-native 的导入。运行 repro 的 npx tsc -p .，使用 skipLibCheck: false 来确认 72 个错误。修复方法是阻止类型声明从 native 侧导入运行时常量，然后验证 metro.config.ts 在没有 React Native globals 的情况下通过类型检查。

由索引模型根据 Issue 内容生成。

描述

Before submitting a new issue
  • I tested using the latest version of the library, as the bug might be already fixed.
  • I tested using a supported version of react native.
  • I checked for possible duplicate issues, with possible answers.
Bug summary

Typing a Metro config through react-native-css/metro (or nativewind/metro) loads React Native's types into a Node program. The compiler's declarations import a runtime constant from the native side: src/compiler/compiler.types.ts imports VAR_SYMBOL from ../native/reactivity, and src/native/reactivity.ts imports from react-native. React Native's declarations bring its runtime globals (fetch, AbortController, Blob, require…), which clash with @types/node's, so a metro.config.ts checked with skipLibCheck: false fails.

Library version

0.0.0-nightly.2421ea7 (main at 2421ea77da52), and 3.1.0-rc.0

Environment info
Windows 11 10.0.26300, Node 26.12.1, npm 12.2.1, TypeScript 7.0.2, @types/node 26.6.6, react-native 0.88.1.
No app or native build is involved: the errors come from the type check alone.
Steps to reproduce
  1. Clone the reproducible example: a metro.config.ts holding only import type {} from 'react-native-css/metro';, checked by a tsconfig.json with "types": ["node"] and skipLibCheck: false, beside react-native 0.88.1 and react-native-css 0.0.0-nightly.2421ea7.
  2. npm install --ignore-scripts
  3. npx tsc -p ., then npx tsc -p . --explainFiles to see why react-native is in the program.

Expected: no error; a Metro config's types reach no React Native type.

Actual: 72 errors in Node's and React Native's globals. The first ones:

node_modules/@types/node/module.d.ts(711,13): error TS2403: Subsequent variable declarations must have the same type.  Variable 'require' must be of type 'NodeRequire', but here has type 'Require'.
node_modules/@types/node/web-globals/abortcontroller.d.ts(43,15): error TS2300: Duplicate identifier 'AbortController'.
node_modules/@types/node/web-globals/abortcontroller.d.ts(44,9): error TS2300: Duplicate identifier 'AbortController'.
node_modules/@types/node/web-globals/abortcontroller.d.ts(50,15): error TS2300: Duplicate identifier 'AbortSignal'.
node_modules/@types/node/web-globals/abortcontroller.d.ts(51,9): error TS2300: Duplicate identifier 'AbortSignal'.

and --explainFiles shows where React Native comes from:

node_modules/react-native/types_generated/index.d.ts
   Imported via "react-native" from file 'node_modules/react-native-css/dist/typescript/module/src/native/reactivity.d.ts' with packageId 'react-native/types_generated/[email protected]+@types/[email protected][email protected]'
Reproducible example repository

https://github.com/YevheniiKotyrlo/react-native-css-metro-types-react-native

主要语言
TypeScript
星标
166
派生
45
平均合并
10 天 1 小时
30 天内合并 PR
4

环境准备

  • 没有 Dockerfile 或 Docker Compose 文件
  • 没有 Pull Request 模板
  • 阅读贡献指南

从这里开始

  1. 先读完整个 Issue，再读项目的贡献指南。
  2. 在 Issue 下留言说明你要接手 —— 这能避免两个人做同样的事。
  3. Fork 仓库，在一个分支上完成修改。
  4. 提交 Pull Request，并在描述里引用这个 Issue 编号。

nativewind/react-native-css 的其他 Issue

查看 nativewind/react-native-css 的全部 Issue

相似的 Issue

更多 TypeScript Issue

把新 issue 发到你的邮箱

精选适合新手参与的 GitHub issue 摘要。