$ global作为导入的"jquery"模块与Webpack

Question

我已经安装了@types/jquery软件包，并且与Webpack Bundle分开加载。

这可能以后更改，我想在使用jQuery的情况下使用import * as $ from 'jquery'。我不希望安装和捆绑真正的jquery软件包，只有`@type/jquery'来提供jquery类型。

基本上我想要

import * as $ from 'jquery';

要转移到

var $ = window.$;

我尝试了

  {
    test: require.resolve('jquery'),
    use: 'exports-loader?$=window.$'
  }

但是它失败了，因为没有真正的jquery模块：

找不到模块：错误：无法在'.../src'

中解析'jQuery'

如何实现？

Answer 1

听起来您正在寻找externals webpack选项：

https://webpack.js.org/configuration/externals/

外部配置选项提供了一种将依赖项排除在输出捆绑中的方法。相反，创建的捆绑包取决于该依赖性在消费者的环境中存在。

方便地，上面的链接中的示例使用jQuery进行演示：

webpack.config.js：

externals: {
    jquery: 'jQuery'
}

应用程序代码：

import * as $ from 'jquery';
$('.my-element').animate(...);

使用此选项时，您可以安全地安装jquery作为依赖项，而不会在输出捆绑包中进入。