跳到主要内容
版本:v7

Ionic 简介

Ionic 是一个开源的 UI 工具包,用于使用 Web 技术(HTML、CSS 和 JavaScript)构建高性能、高质量的移动应用,并支持与 Angular、React 和 Vue 等主流框架集成。

通过安装 Ionic 开始构建,或按照我们的首个应用教程学习主要概念。

安装指南

设置系统并安装框架的分步指南。

UI 组件

深入了解 Ionic 精美设计的 UI 组件库。

原生功能

集成原生设备插件,如蓝牙、地图、HealthKit 等。

主题定制

学习如何轻松定制和修改 Ionic 应用的视觉设计,以契合您的品牌。

概览​

Ionic 专注于应用的前端用户体验和 UI 交互——包括 UI 控件、交互、手势、动画。它易于学习,并可与 Angular、React 或 Vue 等其他库或框架集成。或者,也可以通过简单的脚本引入方式独立使用,无需任何前端框架。如果您想在深入了解之前先了解 Ionic 的更多信息,我们制作了一个视频带您了解基础知识。

同一代码库,随处运行​

Ionic 是唯一能够使 Web 开发者从单一代码库构建适用于所有主要应用商店和移动 Web 的应用的移动应用栈。借助自适应样式,Ionic 应用在每个设备上都能呈现原生的外观和体验。

专注于性能​

Ionic 旨在最新的移动设备上以最佳性能运行,采用了高效硬件加速过渡和触控优化手势等最佳实践。

简洁、清晰、实用的设计​

Ionic 的设计使其在所有当前移动设备和平台上都能完美工作和显示。凭借现成的组件、排版以及一个华丽(且可扩展)的、适应每个平台的基础主题,您将能够以时尚的方式构建应用。

原生与 Web 优化​

Ionic 模拟原生应用 UI 规范并使用原生 SDK,将原生应用的 UI 标准和设备功能与开放 Web 的全部能力和灵活性相结合。Ionic 使用 Capacitor(或 Cordova)进行原生部署,或作为渐进式 Web 应用在浏览器中运行。

目标​

跨平台​

构建和部署可在多个平台上运行的应用,例如原生 iOS、Android 以及作为渐进式 Web 应用在 Web 上运行——全部基于同一代码库。一次编写,随处运行。

基于 Web 标准​

Ionic 构建于可靠且标准化的 Web 技术之上:HTML、CSS 和 JavaScript,并使用自定义元素和 Shadow DOM 等现代 Web API。因此,Ionic 组件拥有稳定的 API,不受单一平台供应商的影响。

精美的设计​

简洁、清晰、实用。Ionic 的设计使其在所有平台上开箱即用,呈现精美的显示效果。从预先设计的组件、排版、交互范式和一个华丽(且可扩展)的基础主题开始。

简单性​

Ionic 以简洁为设计理念,使创建应用变得愉快、易于学习,并且几乎任何具备 Web 开发技能的人都可以轻松上手。

框架兼容性​

虽然过去版本的 Ionic 与 Angular 紧密耦合,但 4.x 版本的框架已经重新设计,可作为独立的 Web Component 库使用,并与最新的 JavaScript 框架(如 Angular)集成。Ionic 可以成功地在大多数前端框架中使用,包括 React 和 Vue,但某些框架需要 shim 才能完全支持 Web Component。

JavaScript​

将 Ionic 迁移到 Web Components 的主要目标之一是消除对单一框架托管组件的硬性要求。这使得核心组件只需一个 script 标签就能独立在网页中运行。虽然对于大型团队和大型应用来说,使用框架可能更好,但现在可以将 Ionic 作为独立库在单个页面中使用,甚至在 WordPress 这样的环境中也可以。

Angular​

Angular 一直是 Ionic 卓越表现的核心所在。虽然核心组件已编写为独立的 Web Component 库,但 @ionic/angular 包使得与 Angular 生态系统的集成变得轻而易举。@ionic/angular 包含了 Angular 开发者从 Ionic 2/3 过渡时所期望的所有功能,并与核心 Angular 库(如 Angular router)集成。

React​

Ionic 现已正式支持流行的 React 库。Ionic React 让 React 开发者能够利用现有的 Web 技能构建面向 iOS、Android 和 Web 的应用。通过 @ionic/react,您可以使用所有核心 Ionic 组件,而且体验上如同使用原生 React 组件一样。

Vue​

Ionic 现已正式支持流行的 Vue 3 库。Ionic Vue 让 Vue 开发者能够利用现有的 Web 技能构建面向 iOS、Android 和 Web 的应用。通过 @ionic/vue,您可以使用所有核心 Ionic 组件,而且体验上如同使用原生 Vue 组件一样。

未来支持​

对其他框架的支持将在未来版本中考虑。

Ionic CLI​

官方 Ionic CLI,即命令行界面,是一个快速搭建 Ionic 应用并提供大量有用命令的工具。除了安装和更新 Ionic 之外,CLI 还带有内置的开发服务器、构建和调试工具等。如果您是 Appflow 会员,CLI 还可用于执行云构建和部署以及管理您的账户。

Appflow​

为了帮助在整个生命周期内构建、部署和管理 Ionic 应用,我们为生产级应用提供了一项名为 Appflow 的商业服务,该服务与开源框架是分开的。

Appflow 帮助开发者和团队编译原生应用构建,并通过集中式仪表板将实时代码更新部署到 Ionic 应用。可选择付费升级以获得更高级的功能,例如直接发布到应用商店、工作流自动化、单点登录 (SSO) 以及访问连接的服务和集成。

Appflow 需要一个 Ionic 账户,并为那些有兴趣体验其某些功能的用户提供免费的"Hobby"计划。

生态系统​

Ionic 由一个核心团队全职积极开发和维护,其生态系统由一个国际化的开发者和贡献者社区引导,推动其成长和采用。大大小小的开发者和公司都在使用 Ionic 构建和发布能够在各处运行的出色应用。

加入社区​

全球有超过 200 个国家的数百万 Ionic 开发者。以下是一些加入方式:

  • 论坛:提问和分享想法的好地方。
  • Twitter:我们发布更新并与 Ionic 社区分享内容的地方。
  • GitHub:用于报告 Bug 或请求新功能,请在此处创建 issue。欢迎提交 PR!
  • 内容创作:撰写技术博客或与 Ionic 社区分享您的故事。

许可证​

Ionic UI 工具包是一个免费的开源项目,采用宽松的 MIT 许可证发布。这意味着它可以免费用于个人或商业项目。MIT 也是 jQuery 和 Ruby on Rails 等流行项目使用的相同许可证。

本文档内容(位于 ionic-docs 仓库中)采用 Apache 2 许可证授权。