ESM与CommonJS混用

ESM与CommonJS混用

首先，.js文件的识别是根据package.json中的type字段来的，如果是commonjs或未设置，则识别为commonjs，如果指定是module，则是ESM。

.cjs一定是commonjs，.mjs一定是ESM。

‍

commonjs引用ESM

由于ESM是静态解析，与commonjs的同步加载不同，所以只能用如下方案。

(async function(){
  const X = await import('path/to/xxx.mjs')
  console.log(X) // X 就是常规导出对象
})()

ESM引用commonjs

无法解构

import X from 'path/to/xxx.cjs'

console.log(X) // X 就是完整导出，即module.exports

强行结构方案，实际上还是全部引用

import X from 'path/to/xxx.cjs'

const { y } = X
console.log(y)