使用webpack处理具有外部依赖关系的AMD库

Question

我有一个用AMD风格编写的库，可以与RequireJS一起使用。假定图书馆的用户提供jquery和jquery-ui。说它看起来像这样：

// main-lib.js 
define(['jquery', './aux-lib.js'], function ($) { ..(1).. }); 

// aux-lib.js 
define(['jquery', 'jquery-ui'], function ($) { ..(2).. }); 

我想弄清楚webpack的工作原理。例如，假设我想这些文件打包成一个单一的AMD样式库文件，该文件还假定jquery和jquery-ui从外面：

// out.js 
define(['jquery', 'jquery-ui'], function ($) { ..(1)..(2).. }); 

这是如何实现的呢？

当我运行main-lib.js为entry - 点的WebPack，它会抱怨它无法找到jquery和jquery-ui。如果我用resolve.alias配置正确的路径，它将jquery和jquery-ui捆绑到out.js，这不是我想要的。我尝试使用output.externals无济于事。

Answer 1

这是我的一个非常简单，愚蠢的错误。相关字段不是output.externals，而只是externals。请参阅here。其他两个相关领域介绍有output，但externals不是。可以是数组，也可以是数组。这是我目前的配置：

{ 
    entry: './main-lib.js', 
    output: { 
     path: './', 
     filename: 'out.js', 
     libraryTarget: 'amd' 
    }, 
    externals: ['jquery', 'jquery-ui'] 
} 

它的工作很好。