Javascript 优化库的Web包构建

我正在开发一个可以被Node.js和浏览器使用的库。该库是用typescript编写的

此库具有浏览器版本，使用webpack。使用Webpack时，会覆盖多个文件。例如，它将使用基于浏览器的Base64 API，而不是使用Node.js缓冲区，这大大减少了库的大小

这是我的网页包配置的一部分，它使这项工作：

resolve: {
  extensions: ['.web.ts', '.web.js', '.ts', '.js', '.json'],
  alias: {
    // We need an alternative 'querystring', because the default is not
    // 100% compatible
    querystring: 'querystring-browser'
  }
},

这允许我有以下两个文件：

base64.js
base64.web.js

默认情况下，将使用first base64，但webpack更喜欢

.web.js

文件

这很有效

我遇到的问题是，许多用户不下载浏览器版本，而是手动将其添加到他们的脚本标记中。库作为npm依赖项包含是很常见的，最终用户负责运行Webpack并创建一个包含所有依赖项的更大包

在这种情况下，我无法控制网页包的配置，但我希望这些用户仍能从这些优化中受益。我的库的差异很大（几百kb）

---

有没有一种方法可以让用户运行包含在库中的网页包，它依赖于使用更小的基于浏览器的my API版本？

您可以像往常一样，将

package.json

中的

main

字段指向针对节点使用的字段，但您也可以指定webpack将用作浏览器环境入口点的

browser

字段。如果您的库没有太多的依赖项，只需为web自己绑定它，并在

浏览器
字段中指定输出文件
而不是您所要求的（很抱歉），但在您的情况下我会做什么：-检测运行时环境-基于运行时环境，如果使用了错误的版本，则抛出异常或记录警告（取决于您希望的严格程度）。例如，如果在生产中使用非生产React生成，React将记录警告。