将 esbuild 与外部反应一起使用时，我得到不支持“反应”的动态要求

Question

我正在尝试将 esbuild 与外部反应一起使用。

这是我的 package.json 文件中的 esbuild 命令

  "scripts": {
    "esbuild": "esbuild ./src/index.js --bundle --outfile=dist/esmain.js --loader:.js=jsx --external:react-dom --external:react "
  }

运行命令时，我没有收到任何错误：

npm run esbuild

> @1.0.0 esbuild C:\prog
> esbuild ./src/index.js --bundle --outfile=dist/esmain.js --loader:.js=jsx --external:react-dom --external:react


  dist\esmain.js  32.7kb

Done in 13ms

问题是当我在浏览器（chrome）中运行程序时，我在控制台中收到此错误

Uncaught Error: Dynamic require of "react" is not supported
    at __require (esmain.js:12)
    at esmain.js:27
    at esmain.js:899

任何想法如何解决这个问题？

Answer 1

我从错误中的想法是。您导入的代码中的某处会像这样反应，这实际上是一个 commonjs 约定，主要用于 Nodejs，但浏览器不支持

const react = require('react');

因此，只需在代码编辑器中针对 require('react') 进行代码搜索，然后将其替换为 import 语句。希望对你有用

Answer 2

你想通过将 react 标记为外部来实现什么？根据我在doc 中读到的内容，我能想到的唯一用例是一个加载了 react 通用 js 的网站，并且您想在脚本中重用此代码。但后来我的问题是 - 为什么在同一页面上有 2 个应用程序，并且在此之上构建不同。

不知道这是否有帮助，但我写了一个 article about building create-react-app generated with esbuild - 构建反应代码似乎很顺利，尤其是与其他一些框架相比。