javascript - 如何在 ReasonML 绑定(bind)中包含来自相邻文件的非类型化 JavaScript？

Question

在尝试开始使用 Reason 时，在一个 JavaScript 项目中，我有一个非常轻的文件，它试图成为现有的重型库的 Reason 类型接口(interface):

/* TheLibrary.re */
type engine

external addEngine : string -> engine -> unit = "" [@@bs.val] [@@bs.module "../"]

但是，当我尝试在 ReasonReact 项目中使用该库时(已将 @org/the-library 添加到 bsconfig.json bs-dependencies )，

/* AComponent.re */
[@bs.val] [@bs.module "@org/game-engine/dist/game-engine.js"]
   external gameEngine : TheLibrary.engine = "default";

/* Further down, a React lifecycle method, */
TheLibrary.addEngine("Game", gameEngine);

我收到有关 ../ 的错误未找到，相对于该 React 组件:

./src/components/main-menu/AComponent.re
Module not found: Can't resolve '../' in '/Users/ec/Work/reason-reacty/src/components/main-menu'

我也尝试过，而不是 ../在TheLibrary.re的external声明:

1. @bs.module "./index.js" (相关包的非类型化 JavaScript 端的直接 ES6 入口点，)
2. @bs.module "@org/the-library" ，该库的完整名称(即使我在该库中输入？？？)

请帮忙!我希望能够进一步采用 ML，但我很难理解 ReasonReact 的依赖解析!

<小时/>

其他上下文:

因此，我们正在尝试构建我们的第一个 ReasonReact 项目，并且我们已成功将baby's-first-opaque-types 添加到我们的一个内部库中，并将其包含在 ReasonReact 页面中，如下所示 - < em>有效，顺便说一句:

/* Imports.re */
type engine;

[@bs.val] [@bs.module "@org/game-engine/dist/game-engine.js"]
   external gameEngine : engine = "default";
[@bs.val] [@bs.module "@org/the-library"] [@bs.scope "default"]
   external addEngine : (string, engine) => unit = "";

当我们Imports.(addEngine("Game", gameEngine))时，这就产生了，我们需要的全局设置行:TheLibrary.addEngine("Game", GameEngine) 。我正处于尝试将输入信息上游到父项目中并将该代码发布到 npm 的第一阶段，以便所有使用项目都可以开始使用 Reason。

Answer 1

听起来您可能对构成工具链的不同工具有点困惑，所以让我们首先逐一浏览它们，将它们放在适当的位置:

• ReasonReact 是一个与react.js 固执己见的“厚”绑定(bind)库，尽管它的名称实际上并不完全是 Reason 特定的，除了它与 Reason 的 JSX 集成之外句法。称其为 BuckleScript 库会更准确。

• 原因主要是您使用的语法，但通常也更广泛地用于指代其周围的生态系统，并且通常也暗示正在使用 BuckleScript。

• OCaml 是底层语言。理性的“语义”，如果你愿意的话。

• BuckleScript 是 OCaml 到 JavaScript 的编译器。它将一个源文件(被视为一个模块)编译为一个 JavaScript 模块，但也需要其他 OCaml 模块的类型信息作为输入。

现在，我怀疑您已经知道其中的大部分内容，但您似乎不知道的是，这些内容实际上都没有执行任何依赖项解析。工具链的以下部分的作用是:

• BuckleScript 构建系统(或 bsb)根据您在 src 中指定的内容查找本地项目中的所有模块 以及您在 bsconfig.json 的 bs-dependecies 中列出的任何 BuckleScript 库。它将找出所有这些的依赖顺序，并以正确的顺序将它们提供给编译器，为每个 OCaml 模块生成一个 JavaScript 模块(以及一些包含类型信息等的其他工件)。但它不会解决任何 JavaScript 依赖关系。

• 最后，您可能会使用 webpack 或其他一些 JavaScript bundler 将所有 JavaScript 模块组合到一个文件中，因此需要解决任何 JavaScript 依赖关系。这很可能是错误消息的来源。

使用 [@bs.module "some-module"] 将使 BuckleScript 编译器发出 var ... = require('some-module') (或import ... from 'some-module'(如果使用 es6)，但 BuckleScript 本身不会再用它做任何事情。如果它是普通的 CommonJS 模块(或您配置的任何其他模块格式)，则传递给 @bs.module 的字符串与传递给 require 的字符串相同.

另请注意，导入不是在定义 external 的位置发出的，而是在使用它的位置发出的。您可以通过将其重新导出为普通定义来解决它或将其“接地”在模块中，即。 让addEngine = addEngine。

为了准确回答您的问题，我需要知道您使用哪个 bundler 、您在哪里配置了 BuckleScript 来输出其 JavaScript 工件、在哪里使用外部(而不仅仅是定义)以及外部 JavaScript 模块位于哪里。但我希望所有这些基础知识将使您和 future 的读者能够轻松地自己识别和解决问题。如果您仍然有点不确定，请查看已编译的 JavaScript 工件，并将它们视为普通的 JavaScript 模块。至此，这就是它们的全部了。