跳过主要内容

从Cordova迁移到Capacitor:一步步指南

本一步步指南将帮助您将Web应用程序从Cordova迁移到Capacitor,涵盖所有部分并使其易于阅读和遵循。

马丁·多纳迪厄

马丁·多纳迪厄

内容营销人员

从Cordova迁移到Capacitor:一步步指南

使用Cordova迁移到Capacitor:一步步指南

本指南将帮助您将Web应用程序从Cordova迁移到Capacitor,使其易于阅读和遵循。我们将涵盖所有部分并提供一步步的方法。

Cordova和Capacitor简介

Cordova和Capacitor都是用于通过HTML、CSS和JavaScript创建各种平台的原生应用程序的工具。虽然它们共享相似之处,但在原生项目管理、插件管理和CLI/版本管理方面有着关键性的差异。

迁移策略

从 Cordova 迁移到 Capacitor 可以逐步进行或作为一次完整的替换,取决于您的应用的复杂性。 Capacitor 与 Cordova 兼容,允许您在准备好时将现有的 Web 应用切换到它。

为了帮助迁移,请考虑使用 Ionic VS Code 扩展 并审计您的现有 Cordova 插件。您可以继续使用 Cordova 插件,如果需要,可以用 Capacitor 的等效项替换它们。

逐步迁移指南

按照以下步骤将您的 Web 应用从 Cordova 迁移到 Capacitor:

  1. 在一个单独的 code 分支中工作: 在应用这些更改时,建议在单独的 code 分支中工作。

  2. 使用 Capacitor 初始化您的应用: 在终端中打开您的项目并遵循 将 Capacitor 添加到 Web 应用指南 或添加 __CAPGO_KEEP_0__ 到 Ionic 应用程序 adding Capacitor to an Ionic app为应用程序名称和 Bundle ID config.xml 构建您的 web 应用

  3. : 在添加任何本机平台之前,至少要构建您的 web 项目一次。这确保了 __CAPGO_KEEP_0__ 配置文件中的文件夹被正确配置。添加平台 www folder is properly configured in the Capacitor configuration file.

  4. 来添加 iOS 和 Android 平台。这些将在您的项目根目录下创建单独的本机项目文件夹。 npx cap add ios 生成图标和启动屏幕 npx cap add android __CAPGO_KEEP_0__

  5. __CAPGO_KEEP_0__: 如果您已经有现有的图标和启动屏幕图片,请使用 cordova-res 工具生成并将它们复制到本机项目中。

  6. 审计和迁移现有的 Cordova 插件: 请审查您的现有的 Cordova 插件并将它们替换为 Capacitor 的等效项,如果可能的话。移除任何不必要的插件。

  7. 移除 Cordova 插件: 替换或移除 Cordova 插件后,请卸载插件并运行 npx cap sync 以从本机项目中移除插件 code。

  8. 应用额外的权限: 将 plugin.xml 与 iOS 和 Android 上的必需设置映射以应用任何必要的权限。

  9. 配置偏好: 手动添加偏好项 config.xml 将配置写入 Capacitor 配置文件中。

  10. 处理平台特定的配置:为每个平台(iOS 和 Android)配置元素,如所需。 config.xml 更改内容服务的方案

  11. :如果需要,改变应用程序中内容服务的方案以避免数据丢失。测试并移除 Cordova

  12. :测试您的迁移应用程序以确保所有更改都已正确应用。一次满意后,您可以从项目中移除 Cordova 或保留它,如果您计划继续使用 Cordova 插件。恭喜!您成功将 Cordova 应用程序迁移到 __CAPGO_KEEP_0__。要了解有关在 __CAPGO_KEEP_1__ 项目中使用 Cordova 插件或 __CAPGO_KEEP_2__ 开发工作流的更多信息,请访问

Congratulations! You’ve successfully migrated your web app from Cordova to Capacitor. To learn more about using Cordova plugins in a Capacitor project or the Capacitor development workflow, visit the 使用我们的 Capacitor 服务进行实时更新.

我们自豪地提供 Capgo,我们的解决方案使您能够为 __CAPGO_KEEP_1__ 应用程序提供实时更新,使您能够以公平价格进行 Over-The-Air(OTA)更新。这一功能尤其适用于快速修复、部署新功能并确保您的用户始终拥有应用程序的最新版本而无需等待应用商店批准。

We’re proud to offer Capgo, our solution that enables live updates for your Capacitor apps, allowing you to deliver Over-The-Air (OTA) updates at a fair price. This feature is particularly useful for making quick fixes, deploying new features, and ensuring your users always have the latest version of your app without waiting for app store approval.

How Our Capgo Service Works

Capgo 是一项基于云的服务,允许您将实时更新部署到您的 Capacitor 应用程序。它由一个 Web 控制台和一个本机 SDK 组成,后者可以将其整合到您的应用程序中。SDK 在启动时或在特定时间间隔内检查更新,并在后台下载它们。当有可用更新时,SDK 将提示用户安装它。如果用户同意,更新将立即安装并应用。

Capgo 实时更新的好处

  • 更快的更新: 无需等待应用商店审批即可立即部署更新。
  • 减少 Apple Store 的依赖性: 绕过应用商店的限制和限制。
  • 改进的用户体验: 通过最新的功能和 bug 修复来保持用户的参与度,而无需要求用户手动更新应用程序。

如何实施 Capgo 实时更新

要在您的 Capacitor 项目中实施 Capgo 实时更新,请遵循以下步骤:

  • 注册一个 Capgo 账户.
  • 在项目中安装 Capgo SDK。
  • 配置应用程序以在启动或特定时间间隔时检查更新。
  • 使用 Capgo 控制台将更新部署到应用程序中。

结论

我们希望本指南能帮助您将 Cordova 应用程序迁移到 Capacitor。如果您有任何问题或需要帮助进行迁移流程,请随时在我们的 discord 服务器上联系我们。

从 Migrating a Web App from Cordova to Capacitor: A Step-by-Step Guide 中继续

如果您正在使用 Migrating a Web App from Cordova to Capacitor: A Step-by-Step Guide 来规划迁移和企业运营,连接它 Capgo 企业版 为 Capgo 企业版中的产品工作流程 Ionic 企业插件替代品 为 Ionic 企业插件替代品中的产品工作流程 Capgo 替代品 为 Capgo 替代品中的产品工作流程 Capgo 咨询 为 Capgo 咨询中的产品工作流程和 Capgo 高级支持 为 Capgo 高级支持中的产品工作流程。

Capacitor 应用的实时更新

当 web 层的 bug 在线时,通过 Capgo 直接发布修复,而不是等待几天的 app store 审核。用户在后台接收更新,而原生代码的变更仍然在正常的审查路径中。

立即开始

最新博客

Capgo 为您提供创建真正专业的移动应用所需的最佳见解。