Zenn
🟨

require で動的に読み込む

2024/04/03に公開
JavaScript
tech

requireは基本的に動的に使えません。requireはモジュールの読み込み時に実行されるため、コード実行後にモジュールを動的に読み込むことはできないという制限があります。

しかし、いくつかの方法でrequireを動的に使用できるような仕組みを構築することができます。

require.resolve

require.resolveを使用して、モジュールのパスを動的に取得し、そのパスをrequireに渡すことで、動的にモジュールを読み込むことができます。

const path = require.resolve("./my-module");
const myModule = require(path);

// myModuleを使用

require-context

require-contextを使用して、特定のディレクトリ内のモジュールを動的に読み込むことができます。

const context = require.context("./modules", true, /\.js$/);

const modules = context.keys().map(context);

// modulesを使用

dynamic-import

ES2020で導入されたdynamic-importを使用して、モジュールを動的に読み込むことができます。

const myModule = await import("./my-module.js");

// myModuleを使用

注意点

  • requireを動的に使用すると、コードの複雑性が増す
  • すべての環境でサポートされているわけではない
  • 動的に読み込んだモジュールは、キャッシュされない

関連記事

ECMAScript Modules (ESM) と CommonJS

https://zenn.dev/btc/articles/240403_esm_commonjs

Discussion