javascript - 检测node/webpack项目中的文件添加/删除

Question

我正在开发一个 webpack 项目，其中某些类型的对象应该将自己注册到“注册表”中，以便可以通过该项目轻松访问。

更准确地说，项目结构如下例所示:

- src
+- registry
 +- ServiceRegistry.js
+- services
 +- index.js
 +- Service1.js
+ index.js

src/services/index.js - 该文件负责导入所有服务

import 'services/Service1'

src/services/Service1.js - 服务将自身注册到 ServiceRegistry

import ServiceRegistry from 'registry/ServiceRegistry'
const Service1 = { /* blablabla */ }
ServiceRegistry.register('Service1', Service1)

src/index.js - 服务索引在顶层导入，以确保加载所有服务

import 'services'

每次添加新的“服务”时，都必须在 src/service/index.js 中引用它。这听起来可能很简单，但实际上，当被遗忘时，这通常是浪费时间+有不止一种类型的对象遵循这种模式。

我想要实现的是每次在 src/services 文件夹中创建或删除 .js 时重新生成 src/services/index.js 文件。

一些谷歌搜索没有带来明显的解决方案:(

感谢任何帮助，谢谢!

Answer 1

你试过吗babel-plugin-wildcard ？

从文档示例中看起来正是您正在寻找的内容:

https://github.com/vihanb/babel-plugin-wildcard#example

编辑:粘贴上面链接引用中的示例

示例

具有以下文件夹结构:

|- index.js
|- dir
    |- a.js
    |- b.js
    |- c.js

以下 JS:

import * as Items from './dir';

将被编译为:

const Items = {};
import _wcImport from "./dir/a";
Items.A = _wcImport;
import _wcImport1 from "./dir/b";
Items.B = _wcImport1;
import _wcImport2 from "./dir/c";
Items.C = _wcImport2;

这意味着您将能够使用 Items.A 和 Items.B 访问项目。