Package exports and eslint-plugin-import

2025-02-10

Package exports と eslint-plugin-import

原文は Alex O'Callaghan により 2025-02-10 に公開されました。このブログを購読する

最近、複数のエントリーポイントを持つ新しい npm パッケージを作成していました。Vite のライブラリモードを使って、エントリーポイントを次のように設定しました：

import { defineConfig } from "vite";

export default defineConfig({
  build: {
    lib: {
      entry: {
        library: "src/index.ts",
        "some-import": "src/some-import.ts",
      },
      name: "library",
    },
  },
});

次に、パッケージの package.json ファイルにexports フィールドを追加しました：

{
  "name": "library",
  "main": "./dist/library.cjs",
  "module": "./dist/library.js",
  "types": "./dist/library.d.ts",
  "exports": {
    ".": {
      "types": "./dist/library.d.ts",
      "import": "./dist/library.js",
      "require": "./dist/library.cjs",
      "default": "./dist/library.cjs"
    },
    "./some-import": {
      "types": "./dist/some-import.d.ts",
      "import": "./dist/some-import.js",
      "require": "./dist/some-import.cjs",
      "default": "./dist/some-import.cjs"
    }
  }
}

その後、このパッケージを別のプロジェクトで使ってみたところ、TypeScript はモジュールを解決できていたものの、eslint から次のようなエラーが表示されました：

error Unable to resolve path to module 'library/some-import' import/no-unresolved

このeslint-plugin-import の issueを見つけ、eslint-import-resolver-typescript に切り替えることが推奨されていましたが、このパッケージを使うためだけに他のプロジェクトに設定変更を強いることはしたくありませんでした。

また、同じプロジェクトで msw/browser を何の問題もなくインポートできていたので、msw がどのように設定されているのか調べてみることにしました。

// No complaints from eslint!
import { setupWorker } from "msw/browser";

msw のルートの package.json は自分のものと同じでしたが、パッケージのルートには browser ディレクトリがあり、その中に別の package.json が存在していました：

// node_modules/msw/browser/package.json
{
  "main": "../lib/browser/index.js",
  "module": "../lib/browser/index.mjs",
  "types": "../lib/browser/index.d.ts"
}

これが問題を解決する鍵でした。リゾルバが msw/browser を解決可能な別のパッケージとして扱うようになるのです。自分のライブラリにも library/some-import/package.json に追加の package.json を配置しました：

{
  "main": "../dist/some-import.cjs",
  "module": "../dist/some-import.js",
  "types": "../dist/some-import.d.ts"
}

すると、すべて期待通りに動作するようになりました！同じような問題に直面している方の参考になれば幸いです。

Package exports と eslint-plugin-import

コメント