我们是否还需要为 NPM 预编译包而付出所有这些努力?

Do we still have to make all this effort to precompile packages for NPM?

我目前正在做一个项目,其中会有很多 npm 包。我想在这个项目上采取更激进的方法。因此,不应再预编译任何文件。在包的 src 文件夹中,将只有 d.ts、ts、js、mjs 文件(正如我所说,它们中的任何一个都不应再被预编译)。我这样做是出于懒惰,因为我认为是时候停止预编译文件了!

我的意思是我应该创建多少变体? ESModules、AMD、CommonJs、SystemJS?

我的简单想法是:保持原样(从 'x' 导入 x,导出 foo = 123),使用该包的开发人员将已经拥有合适的工具(Babel、Typescript)!还是不是?

第二个问题:包应该向下编译到哪一层? ES3、ES6?只使用现代浏览器并且只支持现代浏览器的用户打包什么? differential loading 是正确的方法吗? 我只在 HTML 个文件的环境中看到过差异加载。所以作为起点!如果开发人员有选择地使用这些包,我的情况就不是这样了。

具体来说,我的问题是:我们还需要做出所有这些努力吗?目前的最低公分母是什么?我不知道统计数字,但我感觉每个人都在他的项目中使用编译器/预处理器(Babel,PostCss)?

你怎么看这个?

根据我的经验,CommonJS 和 ES 模块是当今相关的技术。你可能决定跳过 CommonJS,这样你就可以不用转译了。然而,很多框架和其他库仍然依赖于CommonJS,它们不能使用ES模块。

作为轻量级方法,您可以执行以下操作:

首先:默认将所有内容编写为 ES 模块,并将您的包布局为默认用作 ES 模块(例如,在中设置 "type":"module"您的 package.json 并使用 .mjs 作为文件结尾)。

Then:使用 Babel,但仅用于创建模块的 CommonJS 回退。这可能看起来像这样:

将以下开发依赖项添加到您的项目中。 (对于语法的特殊情况,还有其他 Babel 插件;Babel 通常会告诉你它需要哪些):

npm install --save-dev @babel/cli @babel/core @babel/plugin-syntax-import-meta @babel/plugin-transform-modules-commonjs

然后将以下块添加到您的 package.json:

"babel": {
    "plugins": [
        [ "@babel/plugin-transform-modules-commonjs" ],
        [ "@babel/plugin-syntax-import-meta" ]
    ]
}

现在您可以使用一行简单的 shell 代码将您的 ES 模块转换为 CommonJS:

# assuming your ES modules are in the lib/ directory
for script in $(find lib/ -iname '*.mjs' | grep -v test.mjs | sed -e 's|.mjs||g'); do
    npx babel $script.mjs > $script.cjs
done

您也可以将此作为脚本添加到您的 package.json。

"scripts": {
    "build": "for script in $(find lib/ -iname '*.mjs' | grep -v test.mjs | sed -e 's|.mjs||g'); do npx babel $script.mjs > $script.cjs; done"
}

现在您可以 运行 使用 npm run build 将其添加为提交挂钩,或者 运行 在推送到 NPM 注册表之前将其添加。您还可以构建到与 ES 模块所在的文件夹不同的文件夹,并通过 .gitignore.

排除该文件夹

这就是我创建我的几个库的方式(出于完全相同的原因),并且它在 CommonJS 和 ES 模块环境中都能完美运行。

顺便说一句,NodeJS 有一些关于将包作为 ES 模块和 CommonJS 运送的文档:https://nodejs.org/api/esm.html#esm_dual_commonjs_es_module_packages