我的回答

webpack是基于cjs的, 遇到cjs可以直接处理, 遇到impot这类的esm语法会先转换成cjs, 然后再进行处理

参考回答

1. es6模块调用commonjs模块

可以直接使用commonjs模块,commonjs模块将不会被webpack的模块系统编译而是原样输出,并且commonjs模块没有default属性

2. es6模块调用es6模块

被调用的es6模块不会添加{ esModule:true },只有调用者才会添加{ esModule:true },并且可以进行tree-shaking操作,如果被调用的es6模块只是import进来,但是并没有被用到,那么被调用的es6模块将会被标记为/ unused harmony default export /,在压缩时此模块将被删除(如果被调用的es6模块里有立即执行语句,那么这些语句将会被保留)

3. commonjs模块引用es6模块

es6模块编译后会添加{ __esModule:true }。
如果被调用的es6模块中恰好有export default语句,那么编译后的es6模块将会添加default属性

4. commonjs模块调用commonjs模块

commonjs模块会原样输出