Ionic 简介

Ionic 是一个开源的用户界面工具包，用于使用网页技术——HTML、CSS 和 JavaScript——构建高性能、高质量的移动应用，并提供对流行框架如 Angular、React 和 Vue 的集成。

🌐 Ionic is an open source UI toolkit for building performant, high-quality mobile apps using web technologies — HTML, CSS, and JavaScript — with integrations for popular frameworks like Angular, React, and Vue.

通过安装 Ionic或按照我们的第一个应用教程来学习主要概念，开始构建吧。

🌐 Get started building by installing Ionic or following our First App Tutorial to learn the main concepts.

安装指南

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

UI 组件

深入研究 Ionic 设计精美的 UI 组件库。

原生功能

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

主题化

了解如何轻松自定义和修改 Ionic 应用的视觉设计以适合你的品牌。

概述

🌐 Overview

Ionic 专注于应用的前端用户体验（UX）和用户界面（UI）交互——包括 UI 控件、交互、手势和动画。它容易学习，并且可以与其他库或框架集成，如 Angular、React 或 Vue。或者，也可以通过简单的 脚本引入 在不使用任何前端框架的情况下单独使用。如果你想在深入学习之前了解更多关于 Ionic 的信息，我们 制作了一个视频 ，带你了解基础知识。

一套代码库，随处运行

🌐 One codebase, running everywhere

Ionic 是唯一一个移动应用堆栈，使网络开发者能够从单一代码库为所有主要应用商店和移动网页构建应用。通过 自适应样式，Ionic 应用在每种设备上都能自然地渲染外观和体验。

🌐 Ionic is the only mobile app stack that enables web developers to build apps for all major app stores and the mobile web from a single codebase. And with Adaptive Styling, Ionic apps look and feel at home on every device.

注重性能

🌐 A focus on performance

Ionic 旨在在最新的移动设备上实现出色的性能和表现，并采用高效硬件加速转换和触摸优化手势等最佳实践。

🌐 Ionic is built to perform and behave great on the latest mobile devices with best practices like efficient hardware accelerated transitions, and touch-optimized gestures.

干净、简单且实用的设计

🌐 Clean, simple, and functional design

Ionic 旨在在所有当前的移动设备和平台上完美运行和显示。通过现成的组件、排版以及漂亮（但可扩展）的基础主题，该主题可适应每个平台，你将以优雅的方式进行构建。

🌐 Ionic is designed to work and display beautifully on all current mobile devices and platforms. With ready-made components, typography, and a gorgeous (yet extensible) base theme that adapts to each platform, you'll be building in style.

原生和 Web 优化

🌐 Native and Web optimized

Ionic 模拟原生应用的 UI 指南并使用原生 SDK，将原生应用的 UI 标准和设备功能与开放网络的全部功能和灵活性结合在一起。Ionic 使用 Capacitor（或 Cordova）进行原生部署，或者作为渐进式网页应用在浏览器中运行。

🌐 Ionic emulates native app UI guidelines and uses native SDKs, bringing the UI standards and device features of native apps together with the full power and flexibility of the open web. Ionic uses Capacitor (or Cordova) to deploy natively, or runs in the browser as a Progressive Web App.

目标

🌐 Goals

跨平台

🌐 Cross-platform

构建和部署可跨多个平台运行的应用，例如原生 iOS、Android 和作为渐进式 Web 应用的网页——所有这些都使用一个代码库。一次编写，随处运行。

🌐 Build and deploy apps that work across multiple platforms, such as native iOS, Android, and the web as a Progressive Web App - all with one code base. Write once, run anywhere.

基于 Web 标准

🌐 Web Standards-based

Ionic 构建在可靠的、标准化的网页技术之上：HTML、CSS 和 JavaScript，使用现代 Web API，如自定义元素和 Shadow DOM。正因为如此，Ionic 组件拥有稳定的 API，并且不受单一平台供应商的左右。

🌐 Ionic is built on top of reliable, standardized web technologies: HTML, CSS, and JavaScript, using modern Web APIs such as Custom Elements and Shadow DOM. Because of this, Ionic components have a stable API, and aren't at the whim of a single platform vendor.

漂亮的设计

🌐 Beautiful Design

干净、简洁且功能齐全。Ionic 被设计为在所有平台上开箱即用，运行流畅且展示美观。 从预设计的组件、排版、交互模式以及华丽（且可扩展）的基础主题开始。

🌐 Clean, simple, and functional. Ionic is designed to work and display beautifully out-of-the-box across all platforms. Start with pre-designed components, typography, interactive paradigms, and a gorgeous (yet extensible) base theme.

简单

🌐 Simplicity

Ionic 在构建时考虑到了简单性，因此创建应用是令人愉快的、易于学习的，并且几乎任何具有 Web 开发技能的人都可以使用。

🌐 Ionic is built with simplicity in mind, so that creating apps is enjoyable, easy to learn, and accessible to just about anyone with web development skills.

框架兼容性

🌐 Framework Compatibility

虽然以前的 Ionic 版本与 Angular 紧密耦合，但框架的 4.x 版本被重新设计为可作为独立的 Web 组件 库使用，并集成了最新的 JavaScript 框架，例如 Angular。Ionic 可以在大多数前端框架中成功使用，包括 React 和 Vue，尽管某些框架需要一个 shim 才能完全支持 Web 组件。

JavaScript

将 Ionic 移动到 Web 组件 的主要目标之一是消除对单一框架托管这些组件的硬性要求。这使得核心组件可以仅通过一个脚本标签在网页中独立运行。虽然使用框架对于大型团队和大型应用来说非常有利，但现在即使在像 WordPress 这样的环境中，也可以将 Ionic 作为独立库在单页应用中使用。

Angular

Angular一直是Ionic卓越的核心所在。虽然核心组件已经被编写为独立的Web组件库，但@ionic/angular包使与Angular生态系统的集成变得轻而易举。@ionic/angular包含了Angular开发者从Ionic 2/3中期望的所有功能，并与核心的Angular库，如Angular路由，进行集成。

🌐 Angular has always been at the center of what makes Ionic great. While the core components have been written to work as a standalone Web Component library, the @ionic/angular package makes integration with the Angular ecosystem a breeze. @ionic/angular includes all the functionality that Angular developers would expect coming from Ionic 2/3, and integrates with core Angular libraries, like the Angular router.

React

Ionic 现在正式支持流行的 React 库。Ionic React 让 React 开发者可以使用现有的 Web 技能来构建面向 iOS、Android 和 Web 的应用。使用 @ionic/react，你可以使用所有核心的 Ionic 组件，但使用方式就像在使用原生的 React 组件一样。

🌐 Ionic now has official support for the popular React library. Ionic React lets React developers use their existing web skills to build apps that target iOS, Android, and the web. With @ionic/react, you can use all the core Ionic components, but in a way that feels like using native React components.

Vue

Ionic 现在正式支持流行的 Vue 3 库。Ionic Vue 让 Vue 开发者可以使用他们现有的网页技能来构建针对 iOS、Android 和网页的应用。使用 @ionic/vue，你可以使用所有核心的 Ionic 组件，但体验就像使用原生 Vue 组件一样。

🌐 Ionic now has official support for the popular Vue 3 library. Ionic Vue lets Vue developers use their existing web skills to build apps that target iOS, Android, and the web. With @ionic/vue, you can use all the core Ionic components, but in a way that feels like using native Vue components.

未来的支持

🌐 Future Support

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

🌐 Support for other frameworks will be considered in future releases.

Ionic CLI

官方的 Ionic CLI，即命令行接口，是一个可以快速构建 Ionic 应用并为 Ionic 开发者提供许多有用命令的工具。除了安装和更新 Ionic 外，CLI 还内置了开发服务器、构建和调试工具，以及更多功能。如果你是 Appflow 会员，CLI 可以用于执行云构建和部署，以及管理你的账号。

🌐 The official Ionic CLI, or Command Line Interface, is a tool that quickly scaffolds Ionic apps and provides a number of helpful commands to Ionic developers. In addition to installing and updating Ionic, the CLI comes with a built-in development server, build and debugging tools, and much more. If you are an Appflow member, the CLI can be used to perform cloud builds and deployments, and administer your account.

应用流程

🌐 Appflow

为了帮助在整个生命周期中构建、部署和管理 Ionic 应用，我们提供了一项面向生产应用的商业服务，称为 Appflow，它 与开源框架是分开的。

Appflow 帮助开发者和团队从集中式仪表板编译本地应用构建并部署实时代码更新到 Ionic 应用。可选的付费升级可提供更高级的功能，例如直接发布到应用商店、工作流自动化、单点登录（SSO）以及访问连接的服务和集成。

🌐 Appflow helps developers and teams compile native app builds and deploy live code updates to Ionic apps from a centralized dashboard. Optional paid upgrades are available for more advanced capabilities like publishing directly to app stores, workflow automation, single sign-on (SSO) and access to connected services and integrations.

Appflow 需要一个 Ionic 账户 ，并提供一个免费的“爱好者”计划，供有兴趣尝试其部分功能的人使用。

生态系统

🌐 Ecosystem

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

🌐 Ionic is actively developed and maintained full-time by a core team, and its ecosystem is guided by an international community of developers and contributors fueling its growth and adoption. Developers and companies small and large use Ionic to build and ship amazing apps that run everywhere.

加入社区

🌐 Join the Community

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

🌐 There are millions of Ionic developers in over 200 countries worldwide. Here are some ways to join:

• 论坛: 一个提问和分享想法的好地方。
• 推特: 我们在这里发布更新并分享来自 Ionic 社区的内容。
• GitHub: 如要报告错误或请求新功能，请在此创建问题。欢迎提交 PR！
• 内容创作： 撰写技术博客或与Ionic社区分享你的故事。

许可

🌐 License

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

此文档内容（位于 ionic-docs 仓库中）根据 Apache 2 许可证授权使用。