Question

我正在尝试使用React 15.6.2和Relay 1.6.2在前端应用程序上升级到Babel 7

webpack捆绑包构建成功。

但是我在浏览器中收到以下控制台错误。

webpack_require （...）。forwardRef不是函数在buildReactRelayContainer

我正在使用webpack 3.12.0

在开发依赖项中拥有try { FileWriter writer = new FileWriter("count.txt"); System.out.println(new Date()); int number = 1000000000; do { writer.write(number + "\n"); } while (number++ < 2000000000); System.out.println(new Date()); writer.close(); } catch (IOException e) { // TODO Auto-generated catch block e.printStackTrace(); }，并在.babelrc中将其设置在插件的顶部，并在webpack中将其设置在插件列表的顶部。

请注意，由于使用了React 15中弃用的babel-plugin-relay的库，我目前无法升级到React 16

.babelrc

propTypes

webpack

{
  "presets": [
    "@babel/preset-env",
    "@babel/preset-react"
  ],
  "sourceMaps": true,
  "plugins": [
    "relay",
    "babel-plugin-ramda",
    "@babel/plugin-syntax-dynamic-import",
    "@babel/plugin-syntax-import-meta",
    "@babel/plugin-proposal-class-properties",
    "@babel/plugin-proposal-json-strings",
    [
      "@babel/plugin-proposal-decorators",
      {
        "legacy": true
      }
    ],
    "@babel/plugin-proposal-function-sent",
    "@babel/plugin-proposal-export-namespace-from",
    "@babel/plugin-proposal-numeric-separator",
    "@babel/plugin-proposal-throw-expressions",
    "@babel/plugin-proposal-export-default-from",
    "@babel/plugin-proposal-logical-assignment-operators",
    "@babel/plugin-proposal-optional-chaining",
    [
      "@babel/plugin-proposal-pipeline-operator",
      {
        "proposal": "minimal"
      }
    ],
    "@babel/plugin-proposal-nullish-coalescing-operator",
    "@babel/plugin-proposal-do-expressions",
    "@babel/plugin-proposal-function-bind"
  ]
}

Answer 1

您正在尝试将效果不好的东西混在一起。最好升级到最新版本的React（16.6〜）和最新版本的webpack（4.3.0）。他们将与Babel 7配合良好。这将是一个巨大的改变，但值得更新！我目前正在更新去年创建的React Workflow，该工作流最初使用了webpack 3.6，Babel 6+和React <16.6，但是当我创建一个新的React Application时，其中添加了React 16.6〜以及webpack 4，我试图用旧的软件包命名来实现Babel，但是没有用。我的webpack配置也不起作用。我必须进行一些重大更改。这是我更新的React工作流回购演示/部署的链接：https://github.com/interglobalmedia/react-workflow-updated-2018更新尚未完成，但是您可以按照我的进度进行操作！它应该很快完成！

使用babel7时，forwardRef在buildReactRelayContainer上不是函数

.babelrc

webpack

1 个答案: