使用 JavaScript 模块的同构 JavaScript 库 - 在浏览器中省略 Node.js 依赖项?

Isomorphic JavaScript library using JavaScript modules - Omitting Node.js dependencies in the browser?

所以我计划编写一个包,希望用户能够在 Node.js 和浏览器中使用。

在 Node.js 端,它将使用 fs 模块。这可能在浏览器中不存在。这可以通过 CommonJS 使用 if 子句来检查模块所在的环境以及简单的 require.

来完成

这不是 import 的情况,因为它已被吊起。

有没有人知道如何构建代码或构建环境以满足同一包中的两种环境?

坚持使用 ES6 导入

Node.js 中的 import 支持似乎有所改进。 In the docs it says:

The --experimental-modules flag can be used to enable support for ECMAScript modules (ES modules).

Once enabled, Node.js will treat the following as ES modules when passed to node as the initial input, or when referenced by import statements within ES module code:

  • Files ending in .mjs.

  • Files ending in .js, or extensionless files, when the nearest parent package.json file contains a top-level field "type" with a value of "module".

  • Strings passed in as an argument to --eval or --print, or piped to node via STDIN, with the flag --input-type=module.

第二种列出的方法可能适用于 node.js。只需确保您的库的 package.json 包含 "type": "module" 并且 Node 应该将其视为 ES6 模块而不是 CommonJS。

有条件的承诺导入 - 您将不得不等待

条件导入已在节点中可用,但实际上不受支持。他们似乎在浏览器中工作。还有一个警告:导入的模块是一个承诺。这意味着只要你计划好你的步骤,你就可以拥有部分同构的代码。知道您可以在浏览器中执行 import("test.js") 并且可以测试 window 意味着您可以巧妙地编写条件并拥有跨平台代码。

例如你可以这样做:

if (typeof window !== 'undefined') const FooPromise = import("foo");

但事实并非如此。祝你好运。希望 node 能更多地支持 es6 动态导入。