前言
在前端开发中，使用模块化已经成为标配。而在大型工程中，模块数量极多，频繁地引入模块也会带来一定的性能问题。在此背景下，rollup-plugin-glob-import 应运而生。它能够将多个模块引入优化成一次引入，是日常前端开发必备的工具之一。
安装
npm 安装
npm install rollup-plugin-glob-import --save-dev
yarn 安装
yarn add rollup-plugin-glob-import --dev
使用教程
下面我们通过一个简单的例子介绍如何使用 rollup-plugin-glob-import。
注册插件
在使用 rollup-plugin-glob-import 之前，需要先注册它。打开 rollup.config.js 文件，在 plugins 数组中添加以下代码：
-- -------------------- ---- -------
------ ---- ---- ----------------------------
------ ------- -
------ --------------
------- -
----- -----------------
------- -----
--
-------- -
------
-
-配置路径
接下来需要在代码中添加需要优化的路径。例如，在 main.js 文件中引入了 a.js、b.js 以及所有以 common.js 结尾的文件，我们可以这样写：
import { glob } from 'glob';
import a from './a.js';
import b from './b.js';
glob('./src/**/*.common.js').then(modules => {
// 使用 modules
});执行 rollup
接下来，我们执行 rollup，即可将多个模块引入优化成一次引入。
rollup -c
总结
通过 rollup-plugin-glob-import 的使用，我们可以将多个模块优化成一次引入，从而优化前端性能。掌握该技术对于日常前端开发来说，具有非常重要的指导意义。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/5f73fbbba9b7065299ccbc4b