動くかな?

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8" />
  <title>Import JSON</title>
</head>
<body>

  <script type="module">
    import myJson from './external.json' assert {type: 'json'};
    console.dir(myJson);
  </script>
</body>
</html>

いくつか問題がある。

  • import/assert はまだ対応してないかも知れない。assertなしでも、拡張子で判断してJSONファイルをインポート出来るかもしれない。実行環境によっては出来ないかも知れない。
  • type="module" はモダンブラウザなら理解する。
  • scriptタグ内にモジュールコードを直接書いても大丈夫。
  • だが、そのときの名前空間構造が分からない。モジュールコードなので、大域ではないローカル名前空間が与えられるはず。そこでの実行は外部に影響しないかも知れない。モジュールコード実行が終わると、モジュールコードの実行環境オブジェクト〈フレーム〉は消えているかも。
  • モジュールコードは、スクリプトコードからインポートしてあげないと、実行だけして消えてしまう(揮発性のコード)。ただし、外部環境(フレーム以外)に副作用で爪痕を残すことはできる。