javascript - 如何为已经模块化的库构建独立的外部依赖js文件？

Question

基本上，我有许多旧版 Web 应用程序引用和使用 CDN ( Kendo UI ) 中的库。我的任务是删除对远程主机的此类请求，因此我想将该库合并到现有的 npm 脚本任务中，该任务将所有依赖项收集到应用程序引用的单个本地 js 文件中。

我遇到的问题是this library不提供可以立即使用的预编译js文件(与jquery或Angular等其他库不同)，但它是模块化的，需要webpack或browserify才能使用它。

由于我们的遗留应用程序不使用模块化方法来加载依赖项，并且我没有范围重写它们，因此我想以某种方式将模块化库打包到等效的 js 文件中，该文件将加载该库，以便我的应用程序可以访问只需通过 <script>引用它。

我尝试使用 browserify 从仅包含 require 的源 js 文件进行编译。引用该库，但随后在我的应用程序中引用已编译的文件会导致错误，因为该库的函数不可用于我的应用程序。

有人能指出我正确的方向吗？

Answer 1

如果您使用一些基于模块的库，并且您想独立使用它们，则需要做两件事。

1. 将模块公开到全局范围。也许使用公开加载程序 https://github.com/webpack-contrib/expose-loader或者甚至只是分配给窗口对象。

2. 如果模块还使用您还包含独立库的库，则需要将这些信息告诉 webpack。

例如。

{
  externals: {
    jquery: 'jQuery' 
  }
  // other stuff..
}

最后，当您添加这些内容时，请记住脚本标记的顺序。例如。确保在捆绑的 javascript 之前包含 jquery。