Skip to main content

Ionic 包和 CDN

Ionic 框架为 Angular、React、Vue 和 JavaScript 提供了 npm 包，还提供了用于快速原型开发的 CDN 链接。选择下面的框架开始使用，或者使用 CDN 在浏览器中测试 Ionic 框架组件。

🌐 Ionic Framework offers npm packages for Angular, React, Vue, and JavaScript, plus CDN links for quick prototyping. Choose your framework below to get started, or use the CDN to test Ionic Framework components in the browser.

Ionic Angular​

启动一个新的 Ionic Angular 应用，或将 Ionic 添加到你现有的 Angular 项目中。

🌐 Start a new Ionic Angular app or add Ionic to your existing Angular project.

+
新的 Angular 项目

使用 Ionic CLI 创建一个新的 Ionic Angular 应用。

+
现有的 Angular 项目

将 Ionic Angular 添加到现有的 Angular 项目中。

Ionic React​

启动一个新的 Ionic React 应用，或将 Ionic 添加到你现有的 React 项目中。

🌐 Start a new Ionic React app or add Ionic to your existing React project.

+
新的 React 项目

使用 Ionic CLI 创建一个新的 Ionic React 应用。

+
现有的 React 项目

将 Ionic React 添加到现有的 React 项目中。

Ionic Vue​

启动一个新的 Ionic Vue 应用或将 Ionic 添加到现有的 Vue 项目中。

🌐 Start a new Ionic Vue app or add Ionic to your existing Vue project.

+
新建 Vue 项目

使用 Ionic CLI 创建一个新的 Ionic Vue 应用。

+
现有的 Vue 项目

将 Ionic Vue 添加到现有的 Vue 项目中。

Ionic JavaScript​

启动一个新的 Ionic JavaScript 应用。

🌐 Start a new Ionic JavaScript app.

+
新的JavaScript项目

使用 Vite 创建一个新的 Ionic JavaScript 应用。

Ionic 框架 CDN​

🌐 Ionic Framework CDN

Ionic 框架可以通过 CDN 包含，以便在 StackBlitz、Plunker、Codepen 或任何其他在线代码编辑器中快速测试！

🌐 Ionic Framework can be included from a CDN for quick testing in a StackBlitz, Plunker, Codepen, or any other online code editor!

建议使用 jsdelivr 从 CDN 访问框架。要获取最新版本，请在 HTML 文件中的 <head> 元素内或在在线代码编辑器中包含外部资源的地方添加以下内容：

🌐 It's recommended to use jsdelivr to access the Framework from a CDN. To get the latest version, add the following inside the <head> element in an HTML file, or where external assets are included in the online code editor:

<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 全局样式表。

🌐 With this it's possible to use all of the Ionic Framework core components without having to install a framework. The CSS bundle will include all of the Ionic Global Stylesheets.

Ionic CDN​

🌐 Ionicons CDN

Ionicons 默认随 Ionic 框架打包，因此如果你正在使用 Ionic，则无需安装。要在不使用 Ionic 框架的情况下使用 Ionicons，请将以下 <script> 放在页面的末尾，紧靠关闭的 </body> 标签之前。

🌐 Ionicons is packaged by default with the Ionic Framework, so no installation is necessary if you're using Ionic. To use Ionicons without Ionic Framework, place the following <script> near the end of your page, right before the closing </body> tag.

<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 文档。

🌐 For more information on using Ionicons, visit the Ionicons documentation.

目录