“当目标低于 ESNext 时，BigInt 文字不可用”

Question

我使用安装了 React 和 TypeScript yarn create react-app my-app --typescript。

然后我写了这段代码：

import React from 'react';

const App: React.FC = () => {
  const theBiggestInt = 9007199254740991n;
  return (
    <div>
   {"Durkurian"}
    </div>
  );
}

export default App;

并得到一个错误：

当目标低于 ESNext 时，BigInt 文字不可用。

问题是什么？我如何解决它？

包.json

{
  "name": "my-app",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@types/jest": "24.0.17",
    "@types/node": "12.7.2",
    "@types/react": "16.9.2",
    "@types/react-dom": "16.8.5",
    "react": "^16.9.0",
    "react-dom": "^16.9.0",
    "react-scripts": "3.1.1",
    "typescript": "3.5.3"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": "react-app"
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  }
}

Answer 1

BigInt已启用node_modules/typescript/lib/lib.es2020.bigint.d.ts，因此它是 的一部分es2020而不是 的一部分esnext。

然而，词法表达式似乎***n不是 的一部分lib.es2020.bigint.d.ts。事实上，这是由esnext.

要启用带有BigInt但不带有****n词汇表达式的打字稿，此配置有效：

{
  "compilerOptions": {
    "lib": [
      "es2020"
    ],
    "module": "commonjs",
    "target": "es2020",
}

将“esnext”添加到库中：

{
  "compilerOptions": {
    "lib": [
      "es2020", "esnext"
    ],
    "module": "commonjs",
    "target": "es2020",
}

然后启用(*) '****n' 词汇表达式的能力。

(*) 另一个单独的问题是 VSCode（如果您正在使用它）有时会不透明地启用“****n”作为有效表达式，即使相关文件中从未明确提及“esnext” tsconfig.json。也许它正在esnext隐式启用？当尝试准确地确定哪些设置启用词法表达式时，这种行为实际上没有帮助***n- 添加esnext到 tsconfig 文件然后将其删除后，使用****n表达式的能力仍然继续。

Answer 2

正如评论中指出的，Bigint 是一项新功能。当 tsconfig.json 中的目标属性为 ESNext 以外的值时，您不能使用 BigInt。但是您不应该\xe2\x80\x99t 这样做，因为浏览器很少支持developer.mozilla.org和caniuse.com。

\n