React Typescript：第 0 行：解析错误：无法读取未定义的属性“名称”

Posted 2023-02-22

【中文标题】React Typescript：第 0 行：解析错误：无法读取未定义的属性“名称”

【英文标题】：React Typescript: Line 0: Parsing error: Cannot read property 'name' of undefined

【发布时间】：2020-06-28 22:28:43

【问题描述】：

今天突然我开始在使用 Typescript 构建的项目中遇到构建错误。在几周内没有更改的文件（或它引用的任何内容）中，我开始得到：

./path/to/my/file.ts
  Line 0:  Parsing error: Cannot read property 'name' of undefined

这个错误首先出现在我们的 CI 上，可以通过在服务器上手动构建来复制，并且在更新所有包后，我终于可以在自己的计算机上重现（运行完美）。现在，即使我拉出项目的旧（构建）提交，我也无法构建它。我已经将yarn.lock 提交给我的回购协议，但即使使用旧的package.json 和yarn.lock（我删除node_modules 并执行yarn），我也无法构建。

这个错误从今天开始就出乎意料。

可能是什么原因？

---

我的（可能相关的）版本：

yarn 1.22.4,
node v13.11.0,
typescript 3.7.5
react 16.12
react-scripts 3.4.0
macOS 10.15 Catalina

【问题讨论】：

我也遇到了同样的问题，请问您找到错误的原因了吗？

@Kenjoe 问题现在自行消失了。可能是依赖项的对等依赖项配置错误。

【参考方案1】：

这个问题显然是由依赖项的一些（对等？）依赖项配置错误引起的，react-scripts 使用 TypeScript 模板。它走了。确保更新您的依赖项，清除 node_modules，甚至清除 package-lock.json 或 yarn.lock，然后立即再次尝试全新构建。

【讨论】：

奇怪，升级到 3.8.X 无济于事，清除了 node_modules 再次安装，一切顺利

将 TS 更新到 3.8.x 修复了我的 eslint 问题，但在清除 node_modules 和 *-lock.json 文件之前，我一直无法构建。为了确定，我还关闭并重新打开了我的 IDE，现在一切正常。

在 2020 年 8 月，我通过在自动将依赖机器人升级到 ^4.0.2 后将 Typescript 回滚到 ^3.9.5 来解决此问题。 YMMV

如果您在升级到 TS 4.0 后遇到这个问题，那是因为 create-react-app 还不支持 TS 4.0（或者更准确地说，它的依赖项不支持）。 github.com/facebook/create-react-app/issues/9515 您可以通过降级 TS、使用 CRA 4.0 的预发布版本或根据 github.com/facebook/create-react-app/issues/9515 强制固定您的 ts-eslint 和解析器依赖项来修复

【参考方案2】：

我的一个app生成的案例

npx create-react-app my-app --template typescript

更准确地说，create-react-app@3.4.1

通过运行以下命令解决了该问题：

rm yarn-lock && rm -rf node_modules && npm i

之后你可以运行：

yarn start 或 npm start

【讨论】：

感谢cretae-react-app 的来电。这解决了我的问题。

虽然，在尝试删除 yarn.lock 并运行 yarn 之后，我还是设法让应用程序使用 yarn 进行编译

为我做的！刚刚删除了node_modules，然后是yarn，就是这样。

【参考方案3】：

只需将 typescript 版本更新到 3.8.x ：Link

【讨论】：

不，没有解决我的问题。每晚更新到 3.9，但仍然相同。

在 4.0 上，仍然遇到同样的问题。

【参考方案4】：

就我而言，我只需要在 ts 文件的末尾添加一个额外的换行符。

export * from './result';
export * from './request';
//new line here

【参考方案5】：

出现此错误是因为您的 typescript 与您的 typescript-eslint 插件不兼容。

您可以通过将这两个依赖项升级到最新版本来修复它。

"devDependencies": 
  "@typescript-eslint/eslint-plugin": "^4.6.0",
  "@typescript-eslint/parser": "^4.6.0",

【参考方案6】：

更新 react-scripts 对我有用。 react-scripts 3.4.0可能不支持typescript 3.7.5

【参考方案7】：

在我的例子中，罪魁祸首是不存在文件的资产导入，例如：

import  ReactComponent as SomeIcon  from '../assets/img/some-icon.svg';

上面的答案帮助我找到了罪魁祸首。 我跑了rm -rf node_modules package-lock.json && npm i && npm start，导致显示真正的错误（而不是无用的神秘“第0行：解析错误：无法读取属性'名称'未定义的")

添加丢失的文件后，错误就消失了。

【参考方案8】：

在我的情况下，这是因为我在 .\src 下有 TS 代码，它在 .\tools 下引用了 TS 代码，但我的 tsconfig.json 中的 include 中只有 src，添加 tools 已修复问题