JavaScriptモジュールを使用したscriptタグの書き方


  1. 外部のJavaScriptモジュールを読み込む場合:

    <script type="module" src="path/to/module.js"></script>

    上記のコードでは、src属性で指定したファイルがモジュールとして読み込まれます。type="module"属性を追加することで、ブラウザに対してモジュールとして解釈するよう指示します。

  2. インラインのJavaScriptモジュールを使用する場合:

    <script type="module">
    // モジュールのコードをここに記述する
    </script>

    上記のコードでは、type="module"属性を使用してインラインのJavaScriptモジュールを定義します。<script>タグの内部にモジュールのコードを記述します。

  3. モジュールをインポートする場合:

    <script type="module">
    import { functionName } from './module.js';
    // インポートした関数を使用するコード
    </script>

    上記のコードでは、importキーワードを使用してモジュールから必要な関数をインポートします。fromキーワードを使用してモジュールのパスを指定します。

これらはJavaScriptモジュールの基本的な使用方法の一部です。実際の開発では、モジュールのエクスポートや複数のモジュールの組み合わせなど、さまざまなシナリオがあります。また、ブラウザの互換性に関しても注意が必要です。