javascript - 如何在 webpack 模块中加载备用 jquery？

Question

我需要加载 jQuery 的替代版本，而不是我的 node_modules 中的版本。我有脚本的本地副本，但无法将其加载到我的 webpack app.ts 中。我已经在我的 webpack 配置中删除了 node_modules 的全局 jQuery 和解析路径，因为我不想要来自 node_modules 的版本。但是我不知道如何将加载的 jquery 传递给需要它的脚本。

我有多个入口点 (app.ts)，每个入口点都需要能够加载不同的 jquery，所以我不能在 webpack 配置中定义 jquery，因为我想使用相同的配置来处理我的所有入口点。

应用.ts

import jquery from '../../../js/jquery-3.3.1.js';

// tried this but didn't help
// window.$ = jquery;
// window.jquery = jquery;

// these two require jquery but fail, it only works if I add back in
// the webpack config to find jquery in node_modules which is what I 
// don't want. popper.js has the same issue as jquery.
import '../../../js/popper-1.12.9.min.js';
import '../../../js/bootstrap-4.0.0.js';
import './js/jquery.matchHeight-min.js';

...

Answer 1

我认为有几种方法可以解决这个问题。

• 添加一些脚本。可以创建一个简单的函数，为不同的给定 entry 点设置不同的 resolve.alias 值。然后使用 ProvidePlugin 甚至 imports-loader 来进行填充并在全局进行设置。 shimming docs
• 使用expose-loader .有了它，您可以需要不同的脚本，但它们都将使用相同的变量名公开。