如何用原生ESM import/export实现排除指定项的模块重导出

纯标准ESM语法做不到直接在重导出语句层面批量排除指定命名导出。这是ESM的静态设计决定的：所有命名导出必须在代码解析阶段就被确定，不支持运行时动态筛选导出项，所以原生没有提供类似解构排除的重导出语法糖。

ESM自带的两种重导出写法，都满足不了排除指定项的需求：

• 全量重导出 export * from '模块路径'：如果多个重导出模块存在同名导出，会直接抛出语法错误，既不会自动覆盖冲突项，也不支持写排除逻辑。比如示例里的两个文件同时导出b，下面的代码根本跑不起来：

  // 直接报错：Detected conflicting star exports: 'b'
  export * from './foo.js'
  export * from './bar.js'
  

• 显式列举重导出 export { 导出项1, 导出项2 } from '模块路径'：必须手动写出每一个要导出的项，在导出项数量多到没法逐一列举的场景下完全不适用。

别踩坑：不要尝试写export { ...fooRest }这种代码，ESM里export {}的大括号不是对象字面量，是专门用来声明静态导出绑定的语法结构，不支持对象展开运算符，写了直接报语法错误。

如果坚持用纯标准ESM、不用TypeScript专属语法、不依赖CommonJS特性，可以根据自己的场景选下面两种方案：

方案1：静态解构+显式导出（保留命名导出、支持tree-shaking） #

思路和你写的CommonJS逻辑接近，先导入模块命名空间对象，解构排除掉冲突项，再把需要保留的项显式导出：

// 导入两个模块的所有导出，作为命名空间对象存在
import * as foo from './foo.js'
import * as bar from './bar.js'

// 解构排除foo里冲突的b变量，剩下的内容存在fooRest里
const { b: _excludeConflictB, ...fooRest } = foo

// 显式声明所有要对外暴露的导出，这些导出名可以被JS引擎、构建工具静态识别
export const { a } = fooRest
export const { b, c } = bar

这个方案的缺点是：如果非冲突的导出项数量特别多，还是需要把所有导出名列出来。实际项目里一般会写个几十行的小脚本，扫一遍源文件的所有导出名，自动生成这段导出代码，不用手动维护。

方案2：默认导出聚合对象（无需列举导出项） #

如果不需要保留独立的命名导出，能接受通过默认导出的对象访问所有内容，可以直接用对象展开聚合，完全不用列举导出项：

import * as foo from './foo.js'
import * as bar from './bar.js'

const { b, ...fooRest } = foo
// 聚合后作为默认导出对外暴露
export default {
  ...fooRest,
  ...bar
}

这个方案的缺点很明显：

• 没法用import { a } from './聚合文件.js'这种命名导入写法，只能先导入整个默认对象，再通过属性访问需要的内容
• 所有导出项被打包成一个整体对象，没法被静态分析做tree-shaking，只要引入这个模块就会把所有导出内容都加载进来。

如果是用Rollup/Vite/Webpack等构建工具的项目，一般不用硬磕原生ESM语法写这种逻辑，直接用对应构建插件提供的重导出排除配置就行。构建阶段插件会静态分析两个模块的所有导出名，自动生成符合ESM规范的静态重导出代码，既不用手动列导出项，也能保留命名导出和tree-shaking能力。

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