前言
在前端开发中，很重要的一项工作就是组织和管理自己的代码。而每个项目都是由多个模块或者组件组成的，这往往会带来文件的复杂性以及花费大量时间去引入模块。针对这个问题，有一种叫做 barrels 的技巧被广泛采用。它的基本思想是将模块的导入路径提前维护，从而避免重复导入模块和模块嵌套调用的问题。
在这个领域，有一个专门用于创建 barrels 的 npm 包 barrelsby。本篇文章将深入讲解 barrelsby 的使用教程，希望此篇文章帮助从未使用过 barrelsby 的开发者快速上手这一工具。
安装 barrelsby
要安装 barrelsby，您需要npm。npm是一款在 Node.js 上管理软件包的工具。您可以在官方网站下载并安装 npm。
安装完成后，您只需要全局安装 barrelsby：
npm install -g barrelsby
barrelsby 的使用
barrelsby 的使用非常简单，只需要在您的项目根目录中创建一个 barrels.json 文件，并在其中列出项目中的每个模块的路径即可。
一个简单的示例：
-- -------------------- ---- -------
-
---------- -
-
------- ---------------------------
------- ----------------
--
-
------- -------------------------
------- --------------
--
-
------- ------------------------
------- -------------
-
-
-在上面的示例中，我们为项目定义了三个 barrels。每个 barrel 都列出了一个路径和一个名称，而这些路径都是每个组件的文件夹路径。barrels 的名称定义了模块的命名空间，它们可以在应用程序中任何需要注入模块的地方使用。
通常情况下，一个应用程序会有很多文件需要打包在一起。因此，barrels 的实际使用与 Node.js 中的模块引用十分相似。例如，当您需要引用 app/components/user.js 文件时，您只需这样做：
import { UserService } from 'app.components';barrelsby 将自动处理路径和名称，帮助您为用户组件注入所需的服务。
barrelsby 的高级使用
使用 barrelsby 不仅仅局限于上面的例子。对 barrelsby 的高级使用包括以下几步：
- 定制 barrel 名称
barrel 的名称默认添加
.barrel后缀。 如果您需要在模块名上使用其他文件名，则可以在 barrelsby 配置文件中指定一个参数。
-- -------------------- ---- -------
-
---------- -
-
------- ---------------------------
------- -----------------
--------- ---------
-
-
-这样配置后，您就可以使用 .foobar 后缀来代替 .barrel 后缀：
import FooService from 'app.components.foober';
- 动态添加 barrel
有的时候您需要在运行时动态地添加 barrel。您可以通过调用
add()方法，向 barrelsby 中注入新的 barrel。
import { barrels } from 'barrelsby';
barrels.add('app.directives', 'app/directives/barrel.js');这样做会在 barresby 中增加一个名为 app.directives 的 barrel。
- 使用 Babel 插件
如果您是使用 ES6 的模块系统编写代码的，则还可以使用 barrelsby 配合 babel 的插件一起使用。此时，您就可以使用更加现代的
import语句。
import { UserService } from 'app.components';
import { NotificationService } from 'app.services';要使用 babel 插件，请自行安装以下插件：
npm install -D babel-plugin-barrelsby
然后在 .babelrc 文件中添加以下配置：
{
"plugins": [
"barrelsby"
]
}结论
以上就是 barrelsby 的使用教程。在本篇文章中，我们学习了如何创建 barrel 配置文件，并了解了 barrelsby 提供的高级功能。通过 barrelsby，您可以更加优雅地组织和管理自己的代码，避免使用繁琐的路径和避免重复引用模块。
我们希望这篇文章可以帮助您更好地了解 barrelsby 的使用方法，为您的前端项目提供更好的读取和维护体验。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/5eedac2ab5cbfe1ea0610960