如何用一行代码实现index.js导出文件夹内所有.js文件？

嘿，我完全懂这种手动写一堆导出语句的烦躁！原生ES模块本身并没有提供一行代码自动导出整个文件夹所有内容的语法，但我们可以根据不同的运行/构建场景，用几种方法来实现你想要的效果：

1. Node.js环境下的动态导出（运行时自动扫描） #

如果你的代码跑在Node.js环境（比如后端服务），可以借助Node的fs模块扫描文件夹，再动态导出所有内容。在index.js里这么写：

CommonJS版本（require/module.exports） #

const fs = require('fs');
const path = require('path');

// 扫描当前文件夹下所有.js文件，排除index.js自己
const files = fs.readdirSync(__dirname)
  .filter(file => file.endsWith('.js') && file !== 'index.js');

// 循环导出每个文件的内容
for (const file of files) {
  const moduleName = path.basename(file, '.js');
  module.exports[moduleName] = require(`./${file}`);
}

ES模块版本（import/export） #

如果你的项目用的是ES模块，需要用动态导入+顶级await（Node.js 14.8+支持）：

import { readdirSync } from 'fs';
import { fileURLToPath } from 'url';
import { dirname, join } from 'path';

const __filename = fileURLToPath(import.meta.url);
const __dirname = dirname(__filename);

// 筛选出目标文件
const files = readdirSync(__dirname)
  .filter(file => file.endsWith('.js') && file !== 'index.js');

// 动态导入并合并导出
const exportsObj = {};
for (const file of files) {
  const module = await import(`./${file}`);
  Object.assign(exportsObj, module);
}

export default exportsObj;

// 如果你想保持命名导出的形式，可以改成：
// for (const file of files) {
//   const module = await import(`./${file}`);
//   for (const [key, value] of Object.entries(module)) {
//     if (key !== 'default') {
//       exports[key] = value;
//     }
//   }
// }

2. 前端构建工具层面的自动导出 #

如果是前端项目，用Webpack、Vite这类构建工具的话，有更简洁的方案：

Webpack方案 #

用Webpack的require.context在编译时扫描文件：

// 创建一个上下文，扫描当前文件夹下的.js文件，不递归子文件夹
const context = require.context('./', false, /\.js$/);

context.keys().forEach(key => {
  // 排除index.js本身
  if (key !== './index.js') {
    const module = context(key);
    Object.assign(exports, module);
  }
});

Vite方案 #

Vite原生支持Glob导入，直接用一行（或几行）搞定：

// 方式1：用Glob语法直接导出（自动排除index.js）
export * from './!(index).js';

// 方式2：动态导入并合并（更灵活）
const modules = import.meta.glob('./*.js', { eager: true });
for (const path in modules) {
  if (path !== './index.js') {
    Object.assign(exports, modules[path]);
  }
}

Vite的./!(index).js是Glob否定模式，专门用来匹配除了index.js之外的所有js文件。

3. Babel插件：编译时自动生成导出语句 #

如果不想在运行时做动态处理，还可以用Babel插件在编译阶段帮你自动生成所有export * from语句，比如babel-plugin-wildcard：

1. 先安装插件：

npm install babel-plugin-wildcard --save-dev

2. 在你的Babel配置文件（比如.babelrc或babel.config.json）里添加：

{
  "plugins": ["wildcard"]
}

3. 最后在index.js里只需要写一行：

export * from './';

这个插件会在编译时自动扫描当前文件夹下的所有js文件，把这一行自动展开成一堆export * from './filename'语句，完全符合你想要的"一行代码搞定"的需求，而且是编译时完成，运行时没有额外开销。

几个注意点 #

• 不管用哪种方案，一定要记得排除index.js本身，不然会触发循环引用导致报错。
• 如果需要递归扫描子文件夹，不同方案的配置不一样：比如Webpack的require.context第二个参数设为true，Node.js的readdirSync加{ withFileTypes: true }再判断是否是目录。
• 动态导出的场景下，文件的加载顺序是不确定的，如果你的模块之间有依赖关系，最好确保依赖是自包含的，或者手动调整扫描后的排序逻辑。

内容的提问来源于stack exchange，提问作者Odin Thorsen