在前端开发过程中，我们经常会用到 webpack 来管理我们的模块和资源。而在开发过程中，我们有时候会需要在某个模块中使用其他模块的变量或函数，这时候就需要使用到 webpack-provides-module 这个 npm 包。这个包可以让我们在某个模块中使用其他模块中的变量或函数，而不需要 import 或 require。
什么是 webpack-provides-module
webpack-provides-module 是一个 webpack 插件，它可以让我们在某个模块中使用其他模块中的变量或函数，而不需要 import 或 require。
如何使用 webpack-provides-module
使用 webpack-provides-module 很简单，只需要安装它并在 webpack 的配置文件中配置即可。
安装 webpack-provides-module
npm install webpack-provides-module --save-dev
配置 webpack-provides-module
在 webpack 的配置文件中配置 webpack-provides-module，示例代码如下：
-- -------------------- ---- -------
----- --------------------------- - -----------------------------------
-------------- - -
-- ---
-------- -
--- -----------------------------
-- --------
--
-
--这里我们将 $ 配置为 jquery，这样在代码中我们就可以直接使用 $，而不需要 import 或 require。
使用 webpack-provides-module
在代码中使用 webpack-provides-module 也很简单，直接使用配置的变量即可，示例代码如下：
$('#app').html('Hello World!');这样我们就可以在某个模块中直接使用 $，而不需要 import 或 require。
注意事项
虽然使用 webpack-provides-module 可以很方便地在某个模块中使用其他模块中的变量或函数，但是需要注意以下几点：
- 确保提供的变量或函数是全局可用的，否则使用时可能会出现错误。
- 确保提供的变量或函数的命名不会与当前模块中的变量或函数冲突。
结语
使用 webpack-provides-module 可以很方便地在某个模块中使用其他模块中的变量或函数，而不需要 import 或 require。但是需要注意提供的变量或函数是否全局可用，以及命名是否冲突。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6005642f81e8991b448e15aa