Typescript 目标 &在旧版浏览器上使用 Promise.allSettled 的库配置

发布于 2025-01-15 23:15:43 字数 807 浏览 3 评论 0 原文

我使用的是打字稿版本 4.3.5 和节点版本 14.18.1。我正在编译针对旧版和新版浏览器的代码（tsconfig 中的 target=es5）。我在源代码中使用 Promise.all 和 Promise.allSettled 。

在较旧的浏览器上，特别是 iPhone 8、IOS 版本 11 上的 Safari，我收到 Promise.allSettled 客户端错误。

根据我的理解，当使用 target=es5 时，打字稿应该编译以使代码与旧设备兼容，因此 Promise.allSettled 应该可以工作。请帮我理解这个问题！以下是我的 tsconfig.json

{
  "compilerOptions": {
    "sourceMap": true,
    "target": "es5",
    "module": "commonjs",
    "esModuleInterop": true,
    "outDir": "dist",
    "jsx": "react",
    "lib": [
      "ES2020.Promise",
      "dom",
      "webworker"
    ],
    "skipLibCheck": true
  },
  "include": [
    "typings/node.d.ts",
    "typings/modules.d.ts",
    "**/*.ts",
    "**/*.tsx"
  ],
  "exclude": [
    "node_modules",
    "**/*.scss.d.ts"
  ]
}

原文

I am using typescript version 4.3.5 and node version 14.18.1. I am compiling my code targeting old as well as new browsers (target=es5 in tsconfig). I am using Promise.all as well as Promise.allSettled both in my source code.

On older browsers, specifically Safari on IPhone 8, IOS version 11, I am getting client side errors with Promise.allSettled.

As per my understanding, when using target=es5, typescript should compile to make the code compatible with older devices hence Promise.allSettled should work. Please help me understand the issue! Following is my tsconfig.json

{
  "compilerOptions": {
    "sourceMap": true,
    "target": "es5",
    "module": "commonjs",
    "esModuleInterop": true,
    "outDir": "dist",
    "jsx": "react",
    "lib": [
      "ES2020.Promise",
      "dom",
      "webworker"
    ],
    "skipLibCheck": true
  },
  "include": [
    "typings/node.d.ts",
    "typings/modules.d.ts",
    "**/*.ts",
    "**/*.tsx"
  ],
  "exclude": [
    "node_modules",
    "**/*.scss.d.ts"
  ]
}

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

一场春暖 2025-01-22 23:15:43

正如问题为什么我需要使用 Typescript 进行填充？，TypeScript 不会自动提供向后兼容性实现 (“polyfills”）。因此， target tsconfig 的作用比您想象的要少：它仅像箭头函数和生成器一样重写语法，而不是像 Promise 那样重写库。事实上，您首先可以解析 Promise.allSettled 的唯一原因是您在 "ES2020.Promise"。 org/tsconfig#lib" rel="nofollow noreferrer">lib 列表，它告诉 TypeScript 在您的环境中您可以假设您有权访问 ES2020 Promises (具体来说 Promise.allSettled< /a>）。

从那些 lib 文档中，强调我的：

您可能出于以下几个原因想要更改这些 [lib 条目]：

您的程序不在浏览器中运行，因此您不需要“dom”类型定义

您的运行时平台提供了某些 JavaScript API 对象（可能通过 polyfill），但尚不支持给定 ECMAScript 版本的完整语法

您拥有部分（但不是全部）更高级别 ECMAScript 版本的 Polyfill 或本机实现

问题Promise.all 已在 babel ES6 实现中解决，你有多种选择来自己提供一个 polyfill，但值得注意的是 es.promise.all-settled.js 在 core-js 。您可以使用 polyfills 条目将它们集成到您的 Webpack 构建中点指向一个短的polyfill-import-only JS文件，尽管使用babel-polyfill的建议是已弃用，取而代之的是 core-js/stable。

您需要导入或需要其中之一：