可选链接在 create-react-app 中不起作用

Dim*_*iwa 7 javascript reactjs babeljs react-scripts

在一个项目中,我在我的`.babelrc中create-react-app使用@babel/plugin-proposal-optional-chaining

但是,我有这个错误:Module parse failed: Unexpected token (22:16) You may need an appropriate loader to handle this file type.

这是我所有的 babel 依赖项:

{
  "dependencies": {
    "@babel/core": "^7.9.0",
    "@babel/node": "^7.8.7",
    "@babel/plugin-external-helpers": "^7.8.3",
    "@babel/plugin-proposal-class-properties": "^7.8.3",
    "@babel/plugin-proposal-decorators": "^7.8.3",
    "@babel/plugin-proposal-json-strings": "^7.8.3",
    "@babel/plugin-proposal-object-rest-spread": "^7.9.5",
    "@babel/plugin-proposal-optional-chaining": "^7.9.0",
    "@babel/plugin-syntax-dynamic-import": "^7.8.3",
    "@babel/plugin-syntax-import-meta": "^7.8.3",
    "@babel/plugin-transform-async-to-generator": "^7.8.3",
    "@babel/plugin-transform-modules-commonjs": "^7.9.0",
    "@babel/plugin-transform-react-constant-elements": "^7.9.0",
    "@babel/plugin-transform-react-inline-elements": "^7.9.0",
    "@babel/plugin-transform-runtime": "^7.9.0",
    "@babel/polyfill": "^7.8.7",
    "babel-plugin-add-module-exports": "^1.0.2",
    "babel-plugin-array-includes": "^2.0.3",
    "babel-plugin-inline-react-svg": "^1.1.1"
  }
}
Run Code Online (Sandbox Code Playgroud)
  • 节点 v14.0.0
  • npm 6.14.4
  • 反应脚本 2.1.8

为了让它发挥作用,我还需要什么?

Den*_*ash 6

您只需确保已安装react-scripts 3.3.0+版本,因为它已经内置了可选链:

const obj = { a: `Hello` };

// Hello World
const App = () => {
  return (
    <>
      {obj?.a}
      {obj?.b ?? ` World`}
    </>
  );
};
Run Code Online (Sandbox Code Playgroud)

编辑 Nice-paper-74xbv

  • 我注意到,如果我将反应脚本升级到 4+ 可选链接在我的应用程序中不起作用,如果我将其降低到 3.xx 那么它就可以工作!很奇怪...但至少我现在可以正常工作了,我运行的是 2.x 版本! (4认同)