包含JavaScript代码而不打包作为模块

Question

如何要求未与webpack一起打包为UMD兼容模块(AMD,CommonJS)的JavaScript库？

我不希望库通过加载器.我只是希望它在需要时包含在<script>标记中,并且webpack可以管理这种依赖.

我不想简单地将它放在我的脚本标签中index.html,因为我想利用webpack的代码分割,并且只在必要时包含它.

我读过'外部',我不确定这与它有什么关系.文档不够清楚.

谢谢 :)

---

更新的问题

此问题还特别针对前端库,只需通过<script>标签即可实现.

Answer 1

您可以将 amd 支持添加到您的库中，然后使用 webpack 加载它。一些可以帮助您实现目标的链接是：

• http://ifandelse.com/its-not-hard-making-your-library-support-amd-and-commonjs/
• https://github.com/mbostock/d3/pull/1921

基本上要做的是，在库的顶部，您可以检查它是 commonjs 环境还是 AMD 环境。因此，您可以导出您的库。

一个例子可以是这样的（取自第一个链接）

(function (root, factory) {
  if(typeof define === "function" && define.amd) {
    // Now we're wrapping the factory and assigning the return
    // value to the root (window) and returning it as well to
    // the AMD loader.
    define(["postal"], function(postal){
      return (root.myModule = factory(postal));
    });
  } else if(typeof module === "object" && module.exports) {
    // I've not encountered a need for this yet, since I haven't
    // run into a scenario where plain modules depend on CommonJS
    // *and* I happen to be loading in a CJS browser environment
    // but I'm including it for the sake of being thorough
    module.exports = (root.myModule = factory(require("postal")));
  } else {
    root.myModule = factory(root.postal);
  }
}(this, function(postal) {
  // module code here....
  return myModule;
}));