Node.jsのimportエラー対処法：Cannot use import statement outside a module が出た時に試すこと

Node.jsを使用していると、時折「SyntaxError: Cannot use import statement outside a module」というエラーに直面することがあります。このエラーは、JavaScriptのモジュールシステムに関連しており、特にESモジュール（ESM）を使用する際に発生します。

SyntaxError: Cannot use import statement outside a module

本記事では、このエラーの原因と解決策について詳しく解説し、実際のサンプルコードを交えてわかりやすく説明します。

1. エラーの原因を理解する

「Cannot use import statement outside a module」というエラーは、JavaScriptがimport文をモジュールの外で使用しようとしたときに発生します。
Node.jsはデフォルトでCommonJSモジュールを使用しており、ESモジュールを使用するためには特別な設定が必要です。このエラーが発生する主な原因は以下の通りです。

• Node.jsのデフォルト設定
  • Node.jsはCommonJSをデフォルトで使用しているため、import文はサポートされていません。
• package.jsonの設定不足
  • ESモジュールを使用する場合、package.jsonに"type": "module"を追加する必要があります。
• ファイル拡張子の不一致
  • .jsファイルをESモジュールとして扱うためには、.mjs拡張子を使用するか、package.jsonでモジュールタイプを指定する必要があります。

2. 解決策1: package.jsonの設定を確認する

Node.jsでESモジュールを使用するための最初のステップは、package.jsonファイルに"type": "module"を追加することです。これにより、Node.jsはそのプロジェクト内のすべての.jsファイルをESモジュールとして扱います。

1. package.jsonの編集

以下のようにpackage.jsonを編集します。

{
  "name": "your-project-name",
  "version": "1.0.0",
  "type": "module",
  "scripts": {
    "start": "node index.js"
  }
}

この設定を行った後、import文を使用して他のモジュールをインポートできるようになります。

3. 解決策2: ファイル拡張子を変更する

もしpackage.jsonを変更したくない場合、.jsファイルを.mjsに変更することでもESモジュールとして扱うことができます。この方法では、Node.jsは自動的にそのファイルをESモジュールとして認識します。

1. ファイル名の変更

例えば、index.jsというファイルをindex.mjsに変更します。

mv index.js index.mjs

2. インポート文の使用

その後、以下のようにimport文を使用して他のモジュールをインポートできます。

import { myFunction } from './myModule.mjs';

myFunction();

この方法で、Cannot use import statement outside a moduleエラーを回避できます。

4. 解決策3: Babelを使用する

Babelを使用することで、ESモジュールをCommonJSに変換し、Node.js環境で使用することができます。これにより、古いNode.jsバージョンでもESモジュールを利用できるようになります。

1. Babelのインストール

まず、Babelをプロジェクトにインストールします。

npm install --save-dev @babel/core @babel/cli @babel/preset-env

2. Babel設定ファイルの作成

次に、Babelの設定ファイルを作成します。プロジェクトのルートに.babelrcというファイルを作成し、以下の内容を追加します。

{
  "presets": ["@babel/preset-env"]
}

3. スクリプトの実行

Babelを使用してスクリプトを実行するには、以下のようにコマンドを実行します。

npx babel index.js --out-file compiled.js
node compiled.js

この方法で、ESモジュールを使用したコードをNode.jsで実行できるようになります。

5. 解決策4: Webpackを使用する

Webpackを使用してモジュールをバンドルすることも、ESモジュールをNode.jsで使用するための効果的な方法です。Webpackは、モジュールを一つのファイルにまとめることができ、依存関係を管理するのに役立ちます。

1. Webpackのインストール

まず、WebpackとそのCLIをインストールします。

npm install --save-dev webpack webpack-cli

2. Webpack設定ファイルの作成

プロジェクトのルートにwebpack.config.jsというファイルを作成し、以下の内容を追加します。

const path = require('path');

module.exports = {
  entry: './index.js',
  output: {
    filename: 'bundle.js',
    path: path.resolve(__dirname, 'dist')
  },
  mode: 'development'
};

3. Webpackの実行

次に、Webpackを実行してモジュールをバンドルします。

npx webpack

これにより、dist/bundle.jsにバンドルされたファイルが生成されます。このファイルをNode.jsで実行することで、ESモジュールを使用したコードを実行できます。

6. 解決策5: CommonJSに戻す

もしESモジュールを使用する必要がない場合、CommonJSに戻すことも一つの選択肢です。これにより、import文の代わりにrequireを使用することができます。

1. CommonJSの使用

以下のように、requireを使用してモジュールをインポートします。

const myModule = require('./myModule');

myModule.myFunction();

この方法では、特に設定を変更する必要がなく、Node.jsのデフォルトの動作を利用できます。

7. まとめ

「SyntaxError: Cannot use import statement outside a module」というエラーは、Node.jsでESモジュールを使用する際によく発生する問題です。本記事では、エラーの原因とその解決策について詳しく解説しました。

package.jsonの設定、ファイル拡張子の変更、BabelやWebpackの使用、CommonJSへの戻し方など、さまざまなアプローチを紹介しました。これらの方法を活用して、Node.jsでの開発をスムーズに進めてください。

参考

• Fixing “Cannot Use Import Statement Outside a Module” Error – Medium
• Node.js Documentation on ES Modules
• Babel Documentation