跳过主要内容

如何在 Capacitor 插件中添加依赖

学习如何在 Capacitor 插件中跨平台管理依赖项的实用步骤和最佳实践。

马丁·多纳迪厄

马丁·多纳迪厄

内容营销人员

如何在 Capacitor 插件中添加依赖

__CAPGO_KEEP_0__ Capacitor __CAPGO_KEEP_0__

  1. 插件可能会让人感到混乱,但当分解为清晰的步骤时,它变得更容易。以下是您需要知道的内容::

    • JavaScript: 使用 npm 以管理依赖项。
    • iOS: 使用 CocoaPods 或 Swift Package Manager (SPM).
    • Android: 使用 Gradle 为依赖项管理。
  2. 配置您的开发环境:

  3. 开始你的 Capacitor 插件项目:

    • 使用 npm init @capacitor/plugin 来创建一个新插件。
  4. 添加 JavaScript 依赖项:

    • 使用 npm install 用于生产和开发依赖项。
    • Update package.json 包括像 @capacitor/core.
  5. 处理平台特定依赖项:

    • iOS: 使用 CocoaPods 或 SPM 配置库,如 AlamofireSwiftyJSON.
    • Android: 使用 Gradle 添加依赖项,如 Gson 或 AppCompat。
  6. 优化性能:

    • 确保稳定性,通过锁定版本、检查依赖项和解决冲突。
  7. 使用 Capgo 进行实时更新:

    • 无需等待应用商店审核即可立即推送更新。

工具快速比较:

平台工具示例依赖项
JavaScriptnpmnpm install lodash --save
iOSCocoaPods/SPMpod 'Alamofire', '~> 5.6.4'
AndroidGradleimplementation 'com.google.code.gson:gson:2.10.1'

为什么它很重要:有效地管理依赖项确保您的插件在各个平台上顺畅工作,节省时间并避免错误。让我们深入了解步骤。

如何创建一个 Capacitor iOS/Android插件

Capacitor 框架文档网站

设置您的开发环境

准备好您的设置,使用必要的工具来处理 Capacitor 插件 依赖项有效。

必备开发工具

以下是您需要的工具列表:

工具版本用途
Node.js16.0.0+JavaScript 运行环境
npm8.0.0+包管理
Xcode14.0+iOS开发 (Mac only)
Android StudioElectric Eel+Android开发
CocoaPods1.11.0+iOS依赖管理
JDK11+Android构建工具

开始一个新插件

使用 Capacitor CLI 来启动您的插件项目。包括设置平台和使用反向域名格式命名您的插件(例如, com.mycompany.plugin):

  1. 运行以下命令:
    npm init @capacitor/plugin
  2. 选择您的目标平台 (iOS/Android)
  3. 为您的插件分配一个以反向域名格式命名的名称。

项目设置步骤

  1. 更新 package.json

    修改您的 package.json 以包含以下内容:

    {
      "capacitor": {
        "ios": {
          "src": "ios"
        },
        "android": {
          "src": "android"
        }
      },
      "peerDependencies": {
        "@capacitor/core": "^5.0.0"
      }
    }
  2. 平台特定设置

    • 对于 iOS, 确保您的Podfile包含:

      platform :ios, '13.0'
      use_frameworks!
    • 对于 Android, 验证您的 build.gradle 包含:

      android {
          compileSdkVersion 33
          defaultConfig {
              minSdkVersion 22
          }
      }
  3. 设置环境变量

    为您的开发工具配置以下环境变量:

    变量用途示例值
    ANDROID_HOMEAndroid SDK 安装位置/Users/username/Library/Android/sdk
    JAVA_HOMEJDK 安装路径/Library/Java/JavaVirtualMachines/jdk-11.0.12.jdk/Contents/Home
    XCODE_SELECTXcode command line tools/Applications/Xcode.app/Contents/Developer

设置好项目后,您就可以开始管理 JavaScript 依赖了。

JavaScript 依赖

有效地管理 JavaScript 依赖是保持稳定插件性能的关键。

npm 包依赖安装

npm

要安装依赖,请使用以下命令:

# Add a production dependency
npm install lodash --save

# Add a development dependency
npm install @types/lodash --save-dev

请务必手动在文件中包含依赖项的 peer 依赖。测试所有依赖以确认其在 Web 和原生平台上都兼容。 package.json packageInstallation

管理 package.json

这里是一个示例 package.json 配置:

{
  "name": "my-capacitor-plugin",
  "version": "1.0.0",
  "dependencies": {
    "lodash": "^4.17.21"
  },
  "devDependencies": {
    "@types/lodash": "^4.14.195",
    "@capacitor/core": "^5.0.0"
  },
  "peerDependencies": {
    "@capacitor/core": "^5.0.0"
  }
}

为了保持一致性,正确地锁定依赖项版本:

约束类型示例用途
精确”5.0.0”对于需要特定版本的关键依赖项
小心”^5.0.0”允许修订和补丁
波浪线”~5.0.0”[__CAPGO_KEEP_0__]仅更新补丁版本

使用 JavaScript 库

当导入库时,应优先减少打包大小:

// Import only the required function
import { isEqual } from 'lodash';

export class MyPlugin {
  async compare(options: { value1: any, value2: any }): Promise<boolean> {
    return isEqual(options.value1, options.value2);
  }
}

另外,请确保正确的错误处理和类型检查:

import { Plugin } from '@capacitor/core';
import { validate } from 'your-validation-library';

@Plugin({
  name: 'MyPlugin',
  platforms: ['web', 'ios', 'android']
})
export class MyPlugin {
  async validateData(data: unknown): Promise<void> {
    try {
      if (!validate(data)) {
        throw new Error('Invalid data format');
      }
      // Continue processing if valid
    } catch (error) {
      throw new Error(`Validation failed: ${error.message}`);
    }
  }
}

接下来,了解如何处理 iOS 平台特定的依赖项。

iOS 依赖项

本节解释了如何管理本机 iOS 依赖项在 Capacitor 插件。 一旦您设置了 JavaScript 依赖项,下一步就是处理本机 iOS 依赖项。

CocoaPods 配置

CocoaPods

首先在 iOS 目录中初始化 CocoaPods:

cd ios
pod init

然后,更新以下配置到 Plugin.podspec 文件:

Pod::Spec.new do |s|
  s.name = 'MyCapacitorPlugin'
  s.version = '1.0.0'
  s.summary = 'Your plugin description'
  s.platform = :ios, '13.0'
  s.dependency 'Capacitor'
  # Include your iOS dependencies here
  s.dependency 'Alamofire', '~> 5.6.4'
end

CocoaPods 配置

初始化 CocoaPods 后,配置 Podfile 以包含 Capacitor 和任何其他第三方库:

platform :ios, '13.0'
use_frameworks!

def capacitor_pods
  pod 'Capacitor', :path => '../../node_modules/@capacitor/ios'
  pod 'CapacitorCordova', :path => '../../node_modules/@capacitor/ios'
end

target 'Plugin' do
  capacitor_pods
  # Add third-party dependencies
  pod 'KeychainAccess', '~> 4.2.2'
  pod 'SwiftyJSON', '~> 5.0.1'
end

target 'PluginTests' do
  capacitor_pods
end

以下是常见的依赖项配置模式:

约束类型示例用途
精确版本pod 'KeychainAccess', '4.2.2'当需要精确控制,例如安全组件时
次要版本pod 'Alamofire', '~> 5.6'For stable APIs that may receive patch updates
主版本pod 'SwiftyJSON', '> 5.0'When flexibility across updates is acceptable

Swift Package Dependencies

如果您不想使用CocoaPods,Swift Package Manager(SPM)是一个不错的替代方案。您可以在Xcode中直接添加SPM依赖项,配置如下: Package.swift 文件:

// Package.swift
dependencies: [
    .package(url: "https://github.com/Alamofire/Alamofire.git", .upToNextMajor(from: "5.6.4")),
    .package(url: "https://github.com/SwiftyJSON/SwiftyJSON.git", from: "5.0.1")
]

要在您的插件code中使用SPM依赖项,请导入它们并根据需要进行集成。例如:

import Capacitor
import Alamofire

@objc(MyPlugin)
public class MyPlugin: CAPPlugin {
    @objc func makeRequest(_ call: CAPPluginCall) {
        AF.request("https://api.example.com/data").response { response in
            // Process the response
            call.resolve([
                "data": response.data
            ])
        }
    }
}

这种方法允许您根据项目需求选择CocoaPods和Swift Package Manager。

Android Dependencies

Set up Android dependencies to ensure smooth native integration. Here’s how to manage dependencies for your Capacitor plugin.

Gradle 依赖项

Gradle Build Tool Interface

在你的 build.gradle 文件:

android {
    defaultConfig {
        minSdkVersion 22
        targetSdkVersion 33
    }
}

dependencies {
    implementation "androidx.appcompat:appcompat:1.6.1"
    implementation "com.google.code.gson:gson:2.10.1"
    implementation "org.jetbrains.kotlin:kotlin-stdlib:1.8.20"
    implementation project(':capacitor-android')
}

定义额外的版本在 buildscript 块:

buildscript {
    ext {
        androidxCoreVersion = '1.10.1'
        kotlinVersion = '1.8.20'
    }
}

一旦依赖项配置完成,请确保设置必要的仓库。

仓库配置

在项目级别 build.gradle,包含所需的Maven仓库:

allprojects {
    repositories {
        google()
        mavenCentral()
        maven { url "https://jitpack.io" }
    }
}

如果你正在使用自定义或私有Maven仓库,请添加以下凭证:

maven {
    url "https://maven.example.com/releases"
    credentials {
        username = project.findProperty("mavenUsername") ?: System.getenv("MAVEN_USERNAME")
        password = project.findProperty("mavenPassword") ?: System.getenv("MAVEN_PASSWORD")
    }
}

设置仓库后,解决可能出现的依赖项冲突。

解决兼容性问题

To handle dependency conflicts, apply version resolutions in your build.gradle:

configurations.all {
    resolutionStrategy {
        force "org.jetbrains.kotlin:kotlin-stdlib:1.8.20"
        force "androidx.core:core-ktx:1.10.1"
    }
}

Here are strategies for resolving common dependency issues:

依赖冲突类型解决策略示例
版本冲突强制使用特定版本force 'com.google.code.gson:gson:2.10.1'
多个版本排除模块exclude group: 'org.json', module: 'json'
传递依赖问题使用严格版本strictly 'androidx.core:core-ktx:1.10.1'

例如,您可以排除冲突的模块,如下所示:

dependencies {
    implementation('library:name:1.0.0') {
        exclude group: 'com.conflicting.dependency'
    }
}

最后,通过启用缓存和并行执行来优化您的构建过程 gradle.properties:

org.gradle.caching=true
org.gradle.parallel=true
org.gradle.jvmargs=-Xmx2048m

Capgo 集成

Capgo 实时更新控制台界面

使用 Capgo 与原生和 JavaScript 依赖管理一起使用,使您的插件更新更快、更容易。

关于 Capgo

Capgo 是一个实时更新平台,专为 Capacitor 插件和应用程序设计。通过超过 750 个生产应用程序的 23.5 万次更新,Capgo 允许开发人员无需 app store 审核即可推送依赖项和 Capacitor 的更新。更新使用端到端加密并符合苹果和安卓的合规标准。 [1], Capgo allows developers to push updates for dependencies and code instantly - no app store review required. Updates are secured with end-to-end encryption and meet both Apple and Android compliance standards.

Capgo 使用以下功能简化管理插件依赖项:

Capgo simplifies managing plugin dependencies with these features:

它做什么__CAPGO_KEEP_0__Key Metric
实时更新几分钟内推送更新24小时内95%用户更新率
部分更新只下载更改的文件434ms平均API响应时间
版本控制管理多个版本全球成功率82%
频道系统针对特定用户组支持多个发布渠道

来源: [1]

Capgo 与 CI/CD 工具如 GitHub Actions、GitLab CI 和 Jenkins 等完美集成,自动更新依赖项并确保插件版本的一致性。这些工具使得将 Capgo 集成到您的工作流程中变得更加容易。

设置 Capgo

按照以下步骤将 Capgo 集成到您的项目中:

  1. 安装 Capgo CLI

    在终端中运行以下命令:

    npx @capgo/cli init
  2. 配置更新偏好

    使用 Capgo 控制台设置发布渠道和偏好。支持云托管和自托管配置。

  3. 添加更新逻辑

    将此 code 添加到您的主插件文件中以启用更新:

    import { Capgo } from '@capgo/capacitor-updater';
    
    // Initialize Capgo
    const capgo = new Capgo({
      appId: 'YOUR_APP_ID',
      channel: 'production'
    });
    
    // Check for updates
    await capgo.checkForUpdate();

“我们实践敏捷开发,@Capgo 在为用户持续交付方面是 mission-critical 的!” - Rodrigo Mantica

Capgo 也提供了一个实时分析仪表板,用于获取更新成功率和用户活动的实时见解。 一键回滚和错误跟踪功能有助于快速解决任何问题,保持您的插件更新顺利进行。

结论

流程审查

管理 Capacitor 插件的依赖项涉及将本机组件(iOS 和 Android)与其 JavaScript 对应项对齐,以确保平滑的集成。 这个过程包括平台特定的设置和管理 JavaScript 包以实现最佳性能。 遵循所述步骤将有助于维持稳定和高效的插件功能。

最佳实践

要有效地管理依赖项,请考虑以下实践:

实践好处如何实施
版本固定避免意外问题使用固定版本在 package.json
平台隔离减少冲突分离本机依赖
定期更新提高安全性及时应用关键补丁
依赖审计检测风险运行 npm audit 频繁

使用实时更新工具如 Capgo 可进一步简化和改进这些实践,通过实时更新使其更容易。

Capgo 的好处

Capgo 简化了依赖管理过程,同时提供强大的性能。它实现了令人印象深刻的 95% 用户更新率在 24 小时内 并维持全球 API 响应时间为 434ms [1]。通过端到端加密,它确保符合苹果和安卓指南的安全更新。对于管理多个插件版本的团队,Capgo 的频道系统允许针对特定用户组的部署。

以下是 Capgo 的性能概览:

指标
全球 API 响应时间434ms
更新成功率82%
用户更新率 (24 小时)95%

继续从如何在Capacitor插件中添加依赖项

如果您正在使用 如何在Capacitor插件中添加依赖项 为native插件工作做好准备,连接它到 Capgo插件目录 在Capgo插件目录中 Capacitor Plugins by Capgo for the implementation detail in Capacitor Plugins by Capgo, 查看__CAPGO_KEEP_0__插件的实现细节 在__CAPGO_KEEP_0__插件中 添加或更新插件 查看添加或更新插件的实现细节, Capgo 原生构建 为产品工作流程中的 Capgo 原生构建。

Capacitor 应用实时更新

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

立即开始

Latest from our Blog

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