如何编写lib.js同时兼容Default与Named导入（Webpack环境）

没问题，要让同一个lib.js同时支持这两种导入方式其实很简单——你只需要在lib.js里同时做命名导出和默认导出就行。这样不管是用默认导入拿整体对象，还是用命名导入单独取成员，都能正常工作，Webpack对这种标准ES模块写法完全支持。

最终的lib.js代码如下：

// lib.js
// 先导入两个子模块内容
import libPart1 from './libPart1';
import libPart2 from './libPart2';

// 命名导出成员，满足main2.js的命名导入需求
export { libPart1, libPart2 };

// 默认导出包含两个成员的对象，满足main1.js的默认导入需求
export default { libPart1, libPart2 };

这样处理后：

• main1.js里通过import lib from './lib'拿到的默认对象，和你原来方式一的行为完全一致，可以正常访问lib.libPart1和lib.libPart2；
• main2.js里的import {libPart1, libPart2} from './lib'会直接拿到对应的模块成员，和方式二的效果完全相同。

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