Node.js で node-fetch を ES モジュールとして使用するサンプルコード
Node.js で node-fetch を利用する際に発生する "Error: require() of ES modules is not supported when importing node-fetch" エラーの原因と解決策
このエラーは、Node.js v16.x以降と node-fetch v3.x以降を組み合わせた場合に発生します。node-fetch v3.xから、ESモジュール専用パッケージに変更されたため、従来の CommonJS 方式でのインポート (require()) がサポートされなくなったことが原因です。
解決策
このエラーを解決するには、以下のいずれかの方法を選択できます。
node-fetch のバージョンを2.x系にダウングレードする
npm install [email protected]
パッケージ設定 (package.json) を修正して ES モジュールを有効にする
package.jsonファイルを開きます。typeフィールドをmoduleに設定します。
{
"name": "your-project-name",
"version": "1.0.0",
"main": "index.js",
"type": "module",
"dependencies": {
"node-fetch": "^3.0.0"
}
}
- プロジェクトを再起動します。
TypeScript を使用する場合は、tsconfig.json ファイルで esModuleInterop オプションを true に設定する
{
"compilerOptions": {
"esModuleInterop": true
}
}
isomorphic-fetch などの代替モジュールを使用する
isomorphic-fetch は、CommonJS と ES モジュールの両方で動作する fetch API の代替実装です。
npm install isomorphic-fetch
esm パッケージを使用する
esm パッケージは、CommonJS モジュールを ES モジュールに変換するツールです。このツールを使用して、[email protected] を ES モジュールに変換してからインポートすることができます。
npm install esm
npm install [email protected]
const fetch = require('esm')(require('node-fetch'));
// ...
- 上記の解決策に加えて、Node.js のバージョンを v15.x 以下にダウングレードすることも可能です。ただし、これは非推奨の方法であり、今後の Node.js のバージョンアップに対応できなくなる可能性があります。
node-fetchの最新バージョンを使用したい場合は、プロジェクト全体を ES モジュールに移行する必要があります。
// main.js
import fetch from 'node-fetch';
(async () => {
const response = await fetch('https://jsonplaceholder.typicode.com/posts/1');
const data = await response.json();
console.log(data);
})();
このコードを実行するには、以下の手順が必要です。
{
"name": "your-project-name",
"version": "1.0.0",
"main": "main.js",
"type": "module",
"dependencies": {
"node-fetch": "^3.0.0"
}
}
- 以下のコマンドを実行して、依存関係をインストールします。
npm install
- 以下のコマンドを実行して、コードを実行します。
node main.js
このコードを実行すると、以下の出力がコンソールに出力されます。
{
"id": 1,
"userId": 1,
"title": "sunt aut facere cupidatat non proident",
"body": "culpa qui officia deserunt mollit anim id est laborum"
}
Node.js v18 では、fetch APIがネイティブにサポートされました。これは、node-fetch パッケージをインストールする必要がないことを意味します。以下のコードは、ネイティブの fetch API を使用して HTTP リクエストを行う方法を示しています。
// main.js
const fetch = require('node-fetch');
(async () => {
const response = await fetch('https://jsonplaceholder.typicode.com/posts/1');
const data = await response.json();
console.log(data);
})();
axios などの代替モジュールを使用する
axios は、node-fetch と同様の機能を提供する人気のある HTTP ライブラリです。axios は、より多くの機能と、より使いやすい API を提供しています。
npm install axios
// main.js
const axios = require('axios');
(async () => {
const response = await axios.get('https://jsonplaceholder.typicode.com/posts/1');
const data = response.data;
console.log(data);
})();
undici を使用する
undici は、node-fetch と axios の背後で動作する低レベルの HTTP クライアントライブラリです。undici を使用すると、より多くの制御とカスタマイズが可能になります。
npm install undici
// main.js
const { Client } = require('undici');
(async () => {
const client = new Client('https://jsonplaceholder.typicode.com');
const response = await client.request('GET', '/posts/1');
const data = await response.body.json();
console.log(data);
})();
各方法の比較
| 方法 | 利点 | 欠点 |
|---|---|---|
node-fetch (v2.x) | 軽量でシンプル | 最新の Node.js バージョンでは非推奨 |
node-fetch (v3.x) | ES モジュールと CommonJS の両方で利用可能 | 一部の古い Node.js バージョンでは動作しない |
ネイティブ fetch API | 軽量でシンプル、インストール不要 | Node.js v18以降でのみ利用可能 |
axios | 使いやすく、多くの機能を提供 | node-fetch よりも少し重い |
undici | より多くの制御とカスタマイズが可能 | 低レベルなライブラリであり、複雑な場合がある |
node-fetch を Node.js で使用する方法はいくつかあります。最良の方法は、プロジェクトのニーズと要件によって異なります。
- 軽量でシンプルなソリューションが必要な場合は、
node-fetch(v2.x) またはネイティブのfetchAPI を使用します。 - より多くの機能と使いやすさを求める場合は、
axiosを使用します。 - より多くの制御とカスタマイズが必要な場合は、
undiciを使用します。
javascript node.js node-fetch
