≪ Today I learned.
RSS購読
    公開日
    タグ
    JavaScript
    著者
    ダーシノ

    CommonJSとESModulesのデュアルパッケージをつくる

    Modules: Dual CommonJS/ES module packagesにかかれていることをrollupを使って対応する場合、以下のようになる。

    パッケージ提供側

    // rollup.config.js
export default {
  input: './index.js',
  output: [
    { file: './lib/package.cjs', format: 'cjs' },  // Node.js用
    { file: './lib/package.mjs', format: 'es' },   // ESModules用
  ]
}
    // package.json
{
  "name": "package",
  "type": "module",
  "files": [
    "lib"
  ],
  // exports で ESM/CJS を分けるので、 ["main": "./index.js"] は不要
  "exports": {
    "import": "./lib/package.mjs",
    "require": "./lib/package.cjs"
  },
}

    パッケージ使用側

    // client.node.js
// lib/package.cjs が読み込まれる
const pkg = require('package')


// client.esm.js
// lib/package.mjs が読み込まれる（※ブラウザで実行する場合はバンドラーが必要）
import pkg from 'package'

    デモ