我有一个项目，我使用Select 2（和其他东西），需要jQuery。我尝试用Webpack创建我的前端，但它被加载为几个不同的JavaScript文件（所以我的webpack配置显示多个模块导出）。为了让jQuery/$在打包文件时正确工作，我添加了以下内容：

var webpack = require("webpack");

plugins: [
    new webpack.ProvidePlugin({
        $: "jquery",
        jQuery: "jquery",
    }),
]

我的select2_creator.js看起来有点像：

import 'select2'

$(function() {
    $("#id_dropdown_1").select2({dropdownAutoWidth: true});
    $("#id_dropdown_2").select2({dropdownAutoWidth: true});
});

这是可行的，但现在我想很好地使用jQuery并安装它，而不是在我的文件夹中有一个静态的jquery.min.js。因此，我创建了一个新的js文件，其中只有：import jquery的想法是，名为main_bundles.js的js文件将作为jQuery工作（稍后作为项目中任何地方使用的其他库）。创建了main_bundles.js，并在前端使用（django template）导入：
<script type="text/javascript" src="{% static "custom_js/main_bundles.js" %}"></script>
但是现在前端似乎根本没有“看到”jQuery在那里，我得到了$ is undefined错误。最有可能的是，我只是不太了解JavaScript是如何进行库管理的，以及什么是全局的，什么不是全局的，但老实说，我也找不到它似乎向我解释的正确文档。我如何以“最佳实践/正确”的方式解决这个问题？