Widely available すべての主要ブラウザで対応済み。安心して使用可能。

概要

Import Maps は <script type="importmap"> で裸のモジュール指定子("react" 等)を実際のURLに変換するマッピングを定義します。

対応ブラウザ

デスクトップ

Chrome 89+
Edge 89+
Safari 16.4+
Firefox 108+

モバイル

Chrome Android 89+
Safari iOS 16.4+
Firefox Android 108+

基本構文

HTML
<script type="importmap">
{
  "imports": {
    "react": "https://esm.sh/react@18",
    "react-dom": "https://esm.sh/react-dom@18"
  }
}
</script>
<script type="module">
import React from 'react';
</script>

実務での使いどころ

  • Import maps の活用

    Import Maps。ESモジュールのインポート指定子を解決するマッピング。

注意点

  • 古いブラウザでは対応していない場合がある。

アクセシビリティ

  • スクリーンリーダーでの読み上げを確認すること。