🔥

Capacitorプラグインを作成する

に公開
Capacitor
mobile
tech

前提

  • npxコマンド実行可能
  • @capacitor/cli インストール済み

手順

  1. プラグインフォルダ作成(初期化)コマンド実行
    • 対話形式で、Capacitorプラグインのプロジェクトフォルダを作成(初期化)する
    npm init @capacitor/plugin
    • 以下のような質問をされるので、適宜入力していく
      • What should be the npm package of your plugin? : どんなnpmパッケージ名にするか
      • What should be the Package ID for your plugin? : パッケージID(おそらくJava(android)用)
      • What should be the class name for your plugin? : プラグインクラス名
      • What is the repository URL for your plugin? : GitHubのリポジトリURLとか
  2. プラグインを開発する
    • androidならJava
      • 手順1.で指定したクラス名でクラスファイルが作成されているので、そこに実装していく
    • iosならswift
  3. プラグインをビルドする
    • 以下はプラグインフォルダで実行
    npm install
npm run build
  4. プラグインをプロジェクトにインストールする
    cd {使用するプロジェクトのルートフォルダ}

    // プラグインフォルダからインストールする場合
npm install {プラグインフォルダまでの相対パス}

// GitHubリポジトリからインストールする場合
npm install github:{リポジトリ所有者名}/{リポジトリ名}#{ブランチ名}

    npx cap sync

Discussion