无法在 webpack 中解析 ReasonReact.js

Can't resolve ReasonReact.js in webpack

我正在尝试让 ReasonML 与现有的 React 代码库一起工作。我没有使用 create-react-app。这是一个 hand-built 项目。在大多数情况下,看起来一切都设置得很好。但是,当我尝试使用默认编译的 bs.js 文件 运行 Webpack 时出现错误。

Error: Can't resolve '../lib/js/src/ReasonReact.js'

我的 bsconfig.js 几乎直接 copy/pasted 来自 ReasonML 文档:

{
  "name": "reason-react",
  "reason": {"react-jsx" : 2},
  "sources": ["src"],
  "package-specs": [{
    "module": "commonjs",
    "in-source": true
  }],
  "suffix": ".bs.js",
  "namespace": true,
  "bs-dependencies": ["reason-react"],
  "refmt": 3
}

Bucklescript 正在我期望的位置生成适当的 bs.js 文件。一切都很好。但是,对于 Webpack 找不到它要查找的内容,我并不感到惊讶。没有 /lib/js/src/ReasonReact.js 文件。 /lib/bs 中有一个 ReasonReact.js 文件,node_modules/reason-react/lib/js 中有一个文件。

当我编辑已编译的 ReasonML 文件,并将 ReasonReact 变量指向 node_modules ReasonReact.js 文件时,一切正常。

我查看了几篇教程和文章。也许我错过了什么,但我找不到关于我遇到的错误的任何信息。有没有人知道为什么编译的 bs.js 文件中的路径会被关闭?

问题是您将项目命名为 reason-react。结合打开 namespace,这会创建一个名为 ReasonReact 的本地命名空间模块,它会干扰依赖项的模块解析。

您可以通过在 bsconfig.json 中将 namespace 设置为 false 来解决这个问题,因为这听起来不像是您正在创建一个将被其他人,因此无论如何都不需要命名空间。但是你也应该避免使用与你的依赖项相同的名称,因为它很容易导致像这样令人困惑的问题。

记得更改 bsconfig.jsonpackage.json 中的名称以避免出现问题。