메인 콘텐츠로 건너뛰기

How to Add Dependencies in Capacitor Plugins

의존성 관리를 streamline하는 방법을 배워보세요. 다양한 플랫폼에서 Capacitor 플러그인에 의존성을 추가하는 방법에 대해 실용적인 단계와 최적화된 방법을 배워보세요.

How to Add Dependencies in Capacitor Plugins

의존성을 추가하는 방법 Capacitor 플러그인은 혼란스럽게 느껴질 수 있지만, 단계별로 나누면 더 쉽습니다. 다음은 알아야 할 내용입니다:

  1. 도구를 이해하십시오:

    • JavaScript: 의존성을 관리하기 위해 npm 을 사용하십시오
    • iOS: 의존성을 관리하기 위해 CocoaPods 또는
    • Swift Package Manager (SPM)을 사용하십시오 Android 의존성 관리를 위해.
  2. 개발 환경 설정:

  3. 프로젝트 시작 Capacitor 플러그인 프로젝트:

    • 새로운 플러그인을 만들기 위해 npm init @capacitor/plugin __CAPGO_KEEP_0__
  4. JavaScript 의존성을 추가하세요:

    • 사용하세요 npm install 프로덕션 및 개발 의존성을 위해.
    • 업데이트 package.json peer 의존성을 포함하기 위해 @capacitor/core.
  5. 플랫폼에 따라 의존성을 처리하세요:

  6. 최적화:

    • 버전을 고정하고 의존성을 감사하고 충돌을 해결하여 안정성을 보장하세요.
  7. 도구를 사용하세요 Capgo 실시간 업데이트:

    • 앱 스토어 리뷰 없이 즉시 업데이트를 푸시하세요.

도구 비교:

플랫폼 도구 예시 의존성
자바스크립트 npm npm install lodash --save
iOS CocoaPods/SPM pod 'Alamofire', '~> 5.6.4'
Android Gradle implementation 'com.google.code.gson:gson:2.10.1'

왜 중요합니까?: 의존성 관리를 효과적으로 하려면 플러그인이 플랫폼 간에 무난하게 작동하고 시간을 절약하고 오류를 피할 수 있습니다. 더 깊게 들어가 봅시다.

Capacitor 플러그인 만들기 Capacitor Capacitor 프레임워크 문서

Capacitor Framework Documentation Website

개발 환경 설정

필요한 도구를 준비하여 의존성을 효과적으로 관리하세요. Capacitor 플러그인 의존성을 효과적으로 관리하기 위한 필수 도구

필수 개발 도구

다음은 필요한 도구 목록입니다.

도구 버전 목적
Node.js 16.0.0+ JavaScript 런타임 환경
npm 8.0.0+ 패키지 관리
Xcode 14.0+ iOS 개발 (Mac 전용)
Android Studio Electric Eel+ Android 개발
CocoaPods 1.11.0+ iOS 의존성 관리
JDK 11+ 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에 다음을 포함하도록 하세요: AndroidAndroid

      platform :ios, '13.0'
      use_frameworks!
    • Android 안드로이드, 확인하세요 build.gradle 포함:

      android {
          compileSdkVersion 33
          defaultConfig {
              minSdkVersion 22
          }
      }
  3. 환경 변수 설정

    개발 도구에 대한 환경 변수를 구성하세요:

    변수 목적 예시 값
    ANDROID_HOME 안드로이드 SDK 위치 /Users/username/Library/Android/sdk
    JAVA_HOME JDK 설치 경로 /Library/Java/JavaVirtualMachines/jdk-11.0.12.jdk/Contents/Home
    XCODE_SELECT Xcode 명령 줄 도구 /Applications/Xcode.app/Contents/Developer

프로젝트를 설정한 후, 자바스크립트 의존성을 관리하는 단계로 넘어가세요.

자바스크립트 의존성

자바스크립트 의존성을 효과적으로 관리하는 것은 플러그인 성능을 안정적으로 유지하는 데 중요합니다.

npm 패키지 설치

npm

의존성을 설치하려면 다음 명령어를 사용하세요.

# Add a production dependency
npm install lodash --save

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

해당 의존성을 수동으로 포함하십시오. package.json 모든 의존성을 웹 및 네이티브 플랫폼 모두에서 호환성을 확인하기 위해 테스트하십시오.

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” 패치만 업데이트를 제한합니다.

자바스크립트 라이브러리 사용

라이브러리를 임포트할 때, 번들 사이즈를 줄이기 위해 초점을 맞춰야 합니다:

// 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 의존성

이 섹션은 __CAPGO_KEEP_0__ 플러그인에서 iOS 네이티브 의존성을 관리하는 방법을 설명합니다. Capacitor pluginsCocoaPods

iOS 설정

CocoaPods

iOS 디렉토리에 CocoaPods를 초기화하기 시작하세요:

cd ios
pod init

그런 다음 __CAPGO_KEEP_0__ 및 추가 제3자 라이브러리를 포함하는 다음 구성으로 파일을 업데이트하세요: Plugin.podspec Podfile 구성

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를 초기화한 후 Podfile을 __CAPGO_KEEP_0__ 및 추가 제3자 라이브러리를 포함하도록 구성하세요:

After initializing CocoaPods, configure the Podfile to include Capacitor and any additional third-party libraries:

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

제약 조건 유형

예시 사용 사례 정확한 버전
context pod 'KeychainAccess', '4.2.2' When precise control is needed, such as for security components, __CAPGO_KEEP_0__.
Minor Version pod 'Alamofire', '~> 5.6' 안정적인 API에서 패치 업데이트 받을 수 있는 경우
메이저 버전 pod 'SwiftyJSON', '> 5.0' 업데이트 간의 유연성이 받아 들여질 경우

Swift Package 의존성

SPM 의존성을 직접 Xcode 에서 추가할 수 있습니다. (Translated naturally for the user cultural context, adapting idioms, grammar, tone, and phrasing instead of translating word for word.) 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")
]

플러그인에서 SPM 의존성을 사용하려면 code 에서 그들을 임포트하고 필요에 따라 통합하세요. 예를 들어:

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를 기반으로 프로젝트 요구 사항에 따라 선택할 수 있습니다.

안드로이드 의존성

안드로이드 의존성을 설정하여 원활한 네이티브 통합을 보장하세요. 다음은 Capacitor 플러그인의 의존성을 관리하는 방법입니다.

Gradle 의존성

Gradle 빌드 툴 인터페이스

Capacitor 플러그인에 의존성을 추가하는 방법 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'
    }
}

저장소 설정

프로젝트 수준

, 필요한 Maven 저장소를 포함하십시오. build.gradle사용 중인 Maven 저장소가 커스텀 또는 프라이빗일 경우, 다음과 같은 자격 증명을 추가하십시오.

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

If you’re using custom or private Maven repositories, add credentials like this:

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

레포지토리가 설정되면 발생할 수 있는 의존성 충돌을 해결하세요.

호환성 문제 해결

의존성 충돌을 처리하려면 버전 해결을 적용하세요. build.gradle:

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

일반적인 의존성 문제를 해결하는 전략입니다.

문제 유형 전략 예시
버전 충돌 특정 버전 강제 force 'com.google.code.gson:gson:2.10.1'
여러 버전 모듈 제외 exclude group: 'org.json', module: 'json'
전이적 문제 strict 버전 사용 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 Live Update Dashboard Interface

Using Capgo alongside native and JavaScript dependency management makes updating your plugin faster and easier.

About Capgo

Capgo is a live update platform designed for Capacitor plugins and apps. With over 23.5 million updates delivered across 750 production apps [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 Update Features

Capgo

기능 무엇을 하는가 주요 지표
실시간 업데이트 분 단위로 업데이트를 푸시합니다 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_KEEP_0__ 업데이트 설정

    Capgo 대시보드를 사용하여 배포 채널 및 설정을 구성하세요. 클라우드 호스팅 및 자체 호스팅 구성이 모두 지원됩니다.

  3. __CAPGO_KEEP_0__ 업데이트 로직 추가

    Capacitor 플러그인에 다음 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();

“We practice agile development and @Capgo is mission-critical in delivering continuously to our users!” - Rodrigo Mantica

Capgo은 사용자에게 지속적으로 제공하는 mission-critical 요소이며, Rodrigo Mantica가 agile 개발을 실천하고 있습니다.

결론

프로세스 리뷰

Managing dependencies for Capacitor plugins involves aligning the native components (iOS and Android) with their JavaScript counterparts to ensure smooth integration. This process includes platform-specific setups and managing JavaScript packages to achieve the best performance. Following the outlined steps will help maintain stable and efficient plugin functionality.

최선의 방법

의존성 관리를 효과적으로 관리하려면 다음 방법을 고려하세요:

실천 이점 구현 방법
버전 고정 예상치 못한 문제를 피한다 fixed 버전을 사용하여 package.json
플랫폼 격리 충돌을 최소화한다 자연어 종속성을 분리한다
정기적인 업데이트를 한다 보안을 향상한다 중요한 패치를 즉시 적용한다
종속성 감사 위험을 감지한다 실행한다 npm audit 주기적으로

실시간 업데이트 도구인 Capgo를 사용하면 이러한 관행을 단순화하고 개선할 수 있습니다. 실시간 업데이트 기능을 통해 업데이트를 더 쉽게 관리할 수 있습니다.

Capgo 이점

Capgo는 의존성 관리를 단순화하고 강력한 성능을 제공합니다. 24시간 이내에 95%의 사용자 업데이트율을 달성하고 전 세계 Capgo 응답 시간은 434ms 입니다. 애플과 안드로이드의 지침을 모두 준수하는 보안 업데이트를 보장하기 위해 API는 끝에서 끝까지 암호화합니다. 여러 플러그인 버전을 관리하는 팀에게 API의 채널 시스템은 특정 사용자 그룹에 대한 대상 배포를 허용합니다. 다음은 __CAPGO_KEEP_0__의 성능에 대한 빠른 요약입니다: [1]. With end-to-end encryption, it ensures secure updates that comply with both Apple and Android guidelines. For teams managing multiple plugin versions, Capgo’s channel system allows targeted deployments for specific user groups.

Here’s a quick look at Capgo’s performance:

__CAPGO_KEEP_0__ 전역 응답 시간 434ms
API __CAPGO_KEEP_0__
업데이트 성공률 82%
사용자 업데이트율 (24시간) 95%

Keep going from How to Add Dependencies in Capacitor Plugins

Capacitor 플러그인에 의존성을 추가하는 방법을 사용하고 있다면 How to Add Dependencies in Capacitor Plugins Capacitor 플러그인 디렉토리와 연결하여 Capgo Plugin Directory for the product workflow in Capgo Plugin Directory, Capacitor Plugins by Capgo for the implementation detail in Capacitor Plugins by Capgo, Capacitor 플러그인에 의존성을 추가하는 방법에서 구현 세부 정보 의존성을 추가하거나 업데이트 Ionic Enterprise Plugin Alternatives Ionic Enterprise Plugin Alternatives를 위한 제품 워크플로우 Capgo Native Builds Capgo Native Builds를 위한 제품 워크플로우

Capacitor 앱에 대한 실시간 업데이트

웹-layer 버그가 활성화된 경우 Capgo을 통해修정을 배포하여 앱 스토어 승인 대기일을 1일로 줄일 수 있습니다. 사용자는 배경에서 업데이트를 받으면서 네이티브 변경 사항은 일반적인 검토 경로를 유지합니다.

마틴의 인간 지원

시작하기

최신 블로그

Capgo은 전문적인 모바일 앱을 만들기 위해 필요한 최고의洞察력을 제공합니다.