Ionic パッケージ & CDN
Ionic Framework は、Angular、React、Vue、JavaScript 用の npm パッケージと、迅速なプロトタイピング用の CDN リンクを提供しています。下記からフレームワークを選択して始めるか、CDN を使用してブラウザで Ionic Framework コンポーネントをテストしてください。
Ionic Angular
新しい Ionic Angular アプリを開始するか、既存の Angular プロジェクトに Ionic を追加します。
Ionic CLIを使用して新しいIonic Angularアプリを作成します。
既存のAngularプロジェクトにIonic Angularを追加します。
Ionic React
新しい Ionic React アプリを開始するか、既存の React プロジェクトに Ionic を追加します。
Ionic CLIを使用して新しいIonic Reactアプリを作成します。
既存のReactプロジェクトにIonic Reactを追加します。
Ionic Vue
新しい Ionic Vue アプリを開始するか、既存の Vue プロジェクトに Ionic を追加します。
Ionic CLIを使用して新しいIonic Vueアプリを作成します。
既存のVueプロジェクトにIonic Vueを追加します。
Ionic JavaScript
新しい Ionic JavaScript アプリを開始します。
Viteを使用して新しいIonic JavaScriptアプリを作成します。
Ionic Framework CDN
Ionic Framework は、StackBlitz、Plunker、Codepen、またはその他のオンラインコードエディタで迅速にテストするために、CDN から含めることができます！
CDN からフレームワークにアクセスするには、 jsdelivr を使用することをお勧めします。最新バージョンを入手するためには HTML ファイルの <head> 要素、もしくはオンラインコードエディタの呼び出しコードに、次のコードを追加します。
<script type="module" src="https://cdn.jsdelivr.net/npm/@ionic/core/dist/ionic/ionic.esm.js"></script>
<script nomodule src="https://cdn.jsdelivr.net/npm/@ionic/core/dist/ionic/ionic.js"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@ionic/core/css/ionic.bundle.css" />
これにより、フレームワークをインストールすることなく、Ionic Framework のすべてのコアコンポーネントを使用できます。CSS バンドルには、Ionic のすべてのグローバルスタイルシートが含まれます。
Ionicons CDN
Ionicons はデフォルトで Ionic Framework に同梱されているので、Ionic を使用している場合はインストールは不要です。Ionic Framework を使用せずに Ionicons を使用するためには、ページの終わりの近くにある </body> の閉じタグの直前に以下の <script> タグを配置します。
<script type="module" src="https://cdn.jsdelivr.net/npm/ionicons/dist/ionicons/ionicons.esm.js"></script>
<script nomodule src="https://cdn.jsdelivr.net/npm/ionicons/dist/ionicons/ionicons.js"></script>
Ionicons の使用に関する詳細については、Ionicons ドキュメントをご覧ください。