[解決済み】ECMAScript 6でJSONファイルをインポートする方法は？

質問

ECMAScript 6 で JSON ファイルにアクセスするにはどうすればよいですか？

以下はうまくいきません。

import config from '../config.json'

これは、JavaScriptファイルをインポートしようとすると、正常に動作します。

解決方法は？

ESモジュールを使ったJSONのインポートは、2020年半ばにTC39に機能として提出され、（この編集の時点では）仕様に採用される前の最終段階であるステージ3に入っています（参照）。 https://github.com/tc39/proposal-json-modules をご覧ください。） 上陸すると、次のような使い方ができるようになります。

import someName from "./some/path/to/your/file.json";

ここで someName は、実質的にJSONデータで記述されたJSオブジェクトの変数名です。(そしてもちろん、このインポートは ジャバスクリプト をJSONソースから読み込むのであって、"JSON"を読み込むのではありません)。

もしあなたが十分な最新のバンドル（例えば esbuild など）、あるいは十分新しいトランスパイラ（例えば babel という構文を使えば、サポートについて心配することなく、すでにこの構文を使うことができます。

また、JSONファイルを所有する余裕があれば、最小限の追加コードで、JSONを有効なJSファイルに変換することも可能です。

config.js

export default
{
  // my json here...
}

では...

import config from '../config.js'

は、既存の.jsonファイルのインポートを許可しませんが、一応の仕事はします。