cjs模拟esm

[Rain120]

思考点

• exports = module.exports
  • exports.name => export const name 具名
  • exports {} => export default

伪代码

var $esm = {
  exports: {}
}

;(function (module, exports) {
  module.exports = () => {};
  exports.name = 'esm';
}($esm, $esm.exports));

var esm = $esm.exports;

export { esm as default };

https://q.shanyue.tech/engineering/753.html

实现: https://github.com/wessberg/cjstoesm

Rollup 插件

@rollup/plugin-commonjs

babel-plugin-transform-commonjs

CDN

https://cdn.skypack.dev/

https://jspm.org/

[Rain120]

var LIB =
  (function (modules) {
    var installedModules = {};

    function __webpack_require__ (moduleId) {

      if (installedModules[moduleId]) {
        return installedModules[moduleId].exports;
      }

      var module = installedModules[moduleId] = {
        i: moduleId,
        l: false,
        exports: {}
      };

      modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);

      module.l = true;

      return module.exports;
    }

    return __webpack_require__("./test.js");
  })
    ({

      "./test.js":
        (function (module, exports) {
          eval("console.log('test');\n\n//# sourceURL=webpack://LIB/./test.js?");
        })
    });
export default LIB;
export { LIB };