Node.js で "SyntaxError: Unexpected token import" エラーが発生した時の対処方法
Node.js で "SyntaxError: Unexpected token import" エラーが発生する場合、いくつかの原因が考えられます。このエラーは、主に以下の3つの理由で発生します。
- モジュールの読み込みに import キーワードを使用している
- JavaScript のバージョンが古い
- Babelなどのトランスパイラが正しく設定されていない
原因と解決策
import キーワードの使用
Node.js のバージョン 12 以降では、JavaScript モジュールの読み込みに import
キーワードを使用できます。しかし、バージョン 12 以前では import キーワードはサポートされていません。そのため、古いバージョンの Node.js で import
キーワードを使用すると、SyntaxError: Unexpected token import
エラーが発生します。
この問題を解決するには、以下の2つの方法があります。
- Node.js のバージョンを 12 以降に更新する
- require キーワードを使用してモジュールを読み込む
import
キーワードは、JavaScript の ES6 以降で導入された機能です。そのため、JavaScript のバージョンが ES5 以前の場合、import キーワードを使用できません。
- JavaScript のバージョンを ES6 以降に更新する
- Babelなどのトランスパイラを使用して、ES6 コードを ES5 互換コードに変換する
Babelなどのトランスパイラを使用している場合、設定が正しくないと、SyntaxError: Unexpected token import
エラーが発生する可能性があります。
- Babelの設定を確認し、正しく設定されていることを確認する
- Babel のバージョンを最新バージョンに更新する
- モジュールのパスが間違っている
- モジュールが存在しない
- コードに誤りがある
これらの原因の場合は、コードや設定を確認して修正する必要があります。
日本語での解説
上記の情報を日本語で分かりやすく解説します。
Node.js は、JavaScript をサーバーサイドで実行するためのプラットフォームです。npm は、Node.js で使用するモジュールを管理するためのツールです。
import キーワード は、JavaScript の ES6 以降で導入された機能で、モジュールの読み込みに使用できます。
SyntaxError: Unexpected token import エラー は、import
キーワードが正しく使用されていない場合に発生します。
- Node.js のバージョン
- モジュールのパス
- コードの誤り
上記の原因を確認して修正することで、エラーを解決することができます。
補足
- Node.js のバージョン 12 以降では、
import
キーワードを使用できます。
// app.js
import express from 'express';
const app = express();
app.get('/', (req, res) => {
res.send('Hello World!');
});
app.listen(3000, () => {
console.log('Example app listening on port 3000!');
});
このコードを実行するには、以下のコマンドを実行します。
node app.js
このコードは、以下の出力結果を出力します。
Example app listening on port 3000!
注意
このコードを実行するには、Node.js のバージョンが 12 以降である必要があります。
以下のコードは、Babel を使用して ES6 コードを ES5 互換コードに変換する例です。
// app.js
// ES6 コード
import express from 'express';
const app = express();
app.get('/', (req, res) => {
res.send('Hello World!');
});
app.listen(3000, () => {
console.log('Example app listening on port 3000!');
});
babel app.js --out-file app.es5.js
このコマンドを実行すると、app.es5.js
というファイルが作成されます。このファイルは、ES5 互換コードであるため、古いバージョンの Node.js でも実行することができます。
このコードを実行するには、Babel がインストールされている必要があります。
Node.js でモジュールを読み込むその他の方法
require
キーワードは、Node.js のコアモジュールおよびサードパーティモジュールを読み込むために使用できます。
// app.js
const express = require('express');
const app = express();
app.get('/', (req, res) => {
res.send('Hello World!');
});
app.listen(3000, () => {
console.log('Example app listening on port 3000!');
});
このコードは、import
キーワードを使用する例と同じように動作します。
CommonJS モジュールは、Node.js で使用できるモジュールの仕様です。CommonJS モジュールは、require
キーワードを使用して読み込むことができます。
// app.js
const express = require('express');
// CommonJS モジュール
const hello = require('./hello');
app.get('/', (req, res) => {
res.send(hello.world());
});
app.listen(3000, () => {
console.log('Example app listening on port 3000!');
});
// hello.js
module.exports = {
world: () => {
return 'Hello World!';
},
};
このコードは、hello.js
という CommonJS モジュールを読み込み、hello.world()
関数を呼び出しています。
CommonJS モジュールは、ES6 モジュールと互換性がありません。
AMD モジュールは、Asynchronous Module Definition の略で、Node.js で使用できるモジュールの仕様です。AMD モジュールは、require
キーワードを使用して読み込むことができます。
// app.js
// AMD モジュール
define(['jquery'], function($) {
$(document).ready(function() {
// DOMContentLoaded イベントが発生した時に実行される処理
});
});
このコードは、jquery
という AMD モジュールを読み込み、$(document).ready()
関数を呼び出しています。
Node.js でモジュールを読み込む方法はいくつかあります。どの方法を使用するかは、状況によって異なります。
import
キーワードは、ES6 モジュールを読み込むために使用できます。- CommonJS モジュールは、Node.js で使用できるモジュールの仕様です。
javascript node.js npm