ReferenceError：_ 未在数组 .map() 调用中定义答案

【问题标题】：ReferenceError: _ is not defined on an array .map() callReferenceError：_ 未在数组 .map() 调用中定义
【发布时间】：2022-12-20 00:04:16
【问题描述】：

我在这样的 .map 调用中收到“ReferenceError: _ is not defined”：

arr.map(async (elem) => {
...
});

这里似乎没有任何明确提及“_”。当我查看错误的来源时，我看到：

eval
webpack-internal:///./src/components/admin/NameOfMyFile.tsx (115:51)
step
node_modules/tslib/tslib.es6.js (102:0)
Object.eval [as next]
node_modules/tslib/tslib.es6.js (83:45)
asyncGeneratorStep
node_modules/@swc/helpers/src/_async_to_generator.mjs (3:0)
_next
node_modules/@swc/helpers/src/_async_to_generator.mjs (25:0)
eval
node_modules/@swc/helpers/src/_async_to_generator.mjs (32:0)

我在这里的唯一线索是它似乎试图在 tslib.es6.js 中使用某些东西，但在我的 tsconfig.json 中，我的“目标”是“es5”。不太确定这是否起作用或只是转移注意力。

我在 Next.js 上，这是在客户端完成的。（在服务器端，它似乎没有任何问题）

如果有人有任何想法，我会喜欢这里的帮助。谢谢！

【问题讨论】：

ES5 没有本地承诺，因此编译器必须在那里执行一些额外的步骤才能将 ES6 异步代码转换为 ES5。这个过程似乎有错误。不确定如何修复它，但如果您能够以本机方式定位 ES6（即定位非旧版浏览器），那应该可以绕过该错误。
也许你也可以看看你构建的代码，看看那里是否有任何_。

标签： typescript ecmascript-6 next.js lodash ecmascript-5

【解决方案1】：

如果有帮助的话，我也有这个问题，那是因为我在嵌套awaits，就像这样：

const resp = await api(...., {
  headers: {
    Authorization: `Bearer ${await getToken()}` 
  }
})

像这样将 await getToken() 移到外面：

const token = await getToken()
const resp = await api(...., {
  headers: {
    Authorization: `Bearer ${token}` 
  }
})

使问题消失了。我本可以发誓我以前做过这种嵌套等待的事情，但到目前为止我还没有时间弄清楚出了什么问题。祝你好运！

【讨论】：