Azure DevOpsによるReactNativeアプリのCI/CDパイプライン構築事例

{
	"scripts": {
		"build:plugin": "rimraf config/plugin/build && tsc --build config/plugin",
		"prebuild:prod": "run-s build:plugin && cross-env ENVIRONMENT=prod expo prebuild --clean --no-install",
		"lint:es": "eslint --ext .jsx,.js,.tsx,.ts .",
		"lint:tsc": "tsc --noEmit",
		"coverage": "jest --detectOpenHandles --runInBand --coverage --coverageReporters=cobertura"
	}
}

（Expoプロジェクトのルートディレクトリ）
├── fastlane
│ └── Fastfile
├── src
├── assets
├── android
├── ios
├── app.config.js
├── package.json
└── その他の設定ファイル

trigger:
  - develop

pool:
  vmImage: ubuntu-latest

variables:
  - name: appDir
    value: '$(System.DefaultWorkingDirectory)'
  - name: npmConfigCache
    value: '$(Pipeline.Workspace)/.npm'

steps:
  # Node.jsをインストール
  - task: NodeTool@0
    inputs:
      versionSpec: ">=16.0.0"
    displayName: "Install Node.js"

  # npmのキャッシュを復元して依存関係をインストール
  - task: Cache@2
    displayName: Cache npm
    inputs:
      key: 'npm | "$(Agent.OS)" | "$(appDir)/package-lock.json"'
      restoreKeys: |
        npm | "$(Agent.OS)"
      path: $(npmConfigCache)

  - task: CmdLine@2
    displayName: 'npm ci --cache $(npmConfigCache)'
    inputs:
      script: 'npm ci --cache $(npmConfigCache)'
      workingDirectory: '$(appDir)'

  # ESLintによる静的解析
  - script: |
      npm run lint:es
    displayName: "npm run lint:es"

  # TypeScript型チェック
  - script: |
      npm run lint:tsc
    displayName: "npm run lint:tsc"

  # テストとカバレッジ計測
  - script: |
      npm run coverage
    displayName: "npm run coverage"

  # カバレッジ結果を出力
  - task: PublishCodeCoverageResults@1
    displayName: Publish Code Coverage
    inputs:
      codeCoverageTool: Cobertura
      summaryFileLocation: $(System.DefaultWorkingDirectory)/coverage/cobertura-coverage.xml

  # テスト結果を出力
  - task: PublishTestResults@2
    displayName: Publish Test Results
    inputs:
      testResultsFormat: "JUnit"
      testResultsFiles: $(System.DefaultWorkingDirectory)/coverage/jest-junit.xml

trigger: none

parameters:
  - name: environment
    default: prod

variables:
  - name: appDir
    value: "$(System.DefaultWorkingDirectory)"
  - name: npmConfigCache
    value: "$(Pipeline.Workspace)/.npm"

jobs:
  - job: build_${{parameters.environment}}
    displayName: "build ${{parameters.environment}}"
    pool:
      vmImage: macOS-13
    steps:
      # Ruby 3.3をインストール（Fastlane用）
      - task: UseRubyVersion@0
        inputs:
          versionSpec: "3.3"
          addToPath: true

      # Node.js 18.19.0をインストール
      - task: NodeTool@0
        displayName: "Use Node.js 18.19.0"
        inputs:
          versionSpec: "18.19.0"

      # Java 17をインストール（Android開発用）
      - task: JavaToolInstaller@0
        inputs:
          versionSpec: "17"
          jdkArchitectureOption: "x64"
          jdkSourceOption: "PreInstalled"

      # npmのキャッシュを復元して依存関係をインストール
      - task: Cache@2
        displayName: Cache npm
        inputs:
          key: 'npm | "$(Agent.OS)" | "$(appDir)/package-lock.json"'
          restoreKeys: |
            npm | "$(Agent.OS)"
          path: $(npmConfigCache)

      - task: CmdLine@2
        displayName: "npm ci --cache $(npmConfigCache)"
        inputs:
          script: "npm ci --cache $(npmConfigCache)"
          workingDirectory: "$(appDir)"

      # アプリ署名用のKeystoreファイルをダウンロード
      - task: DownloadSecureFile@1
        displayName: "Download Keystore file for Staging"
        inputs:
          secureFile: $(ANDROID_RELEASE_INHOUSE_KEYSTORE_SECURE_FILENAME)

      # Keystoreファイルをプロジェクトルートにコピー
      - task: CopyFiles@2
        displayName: "Copy Keystore file to: $(appDir)"
        inputs:
          SourceFolder: "$(Agent.TempDirectory)"
          Contents: $(ANDROID_RELEASE_INHOUSE_KEYSTORE_SECURE_FILENAME)
          TargetFolder: "$(appDir)"

      # 環境別のFirebase設定ファイルをダウンロード
      - task: DownloadSecureFile@1
        name: googleServicesJson${{parameters.environment}}
        displayName: "Download google-services.json file for ${{parameters.environment}}"
        inputs:
          secureFile: $(GOOGLE_SERVICES_JSON_SECURE_FILENAME)

      # Firebase設定ファイルをプロジェクトルートにコピー
      - task: CopyFiles@2
        displayName: "Copy google-services.json file to: $(appDir)"
        inputs:
          SourceFolder: "$(Agent.TempDirectory)"
          Contents: $(GOOGLE_SERVICES_JSON_SECURE_FILENAME)
          TargetFolder: "$(appDir)"

      # Firebase設定ファイルを標準名にリネーム
      - task: CmdLine@2
        displayName: "Rename google-services.json"
        inputs:
          script: |
            /bin/mv $(GOOGLE_SERVICES_JSON_SECURE_FILENAME) google-services.json
          workingDirectory: "$(appDir)"

      # Fastlane用のGoogle Play ConsoleサービスアカウントJSONファイルをダウンロード
      - task: DownloadSecureFile@1
        displayName: "Download fastlane-supply.json"
        inputs:
          secureFile: "$(FASTLANE_SUPPLY_JSON_FILE_NAME)"

      # Expo prebuildでネイティブAndroidプロジェクトを生成
      - task: CmdLine@2
        displayName: "Prebuild Android app for ${{parameters.environment}}"
        inputs:
          script: "fastlane android prebuild_${{parameters.environment}}"
          workingDirectory: "$(appDir)"

      # アプリ署名用のKeystore設定をgradle.propertiesに追加
      # build.gradle で gradle.properties の値を参照するようにするために、下記コンフィグプラグインを使用
      # https://github.com/Fintan-contents/mobile-app-crib-notes/blob/master/example-app/SantokuApp/config/plugin/src/android/withAndroidAppBuildGradleForRelease.ts
      - task: CmdLine@2
        displayName: "Add gradle.properties settings for ReleaseInHouse"
        inputs:
          script: |
            echo -e '\n# Keystore properties for ReleaseInHouse' >> gradle.properties
            echo 'SANTOKU_UPLOAD_KEYSTORE_FILE=$(appDir)/$(ANDROID_RELEASE_INHOUSE_KEYSTORE_SECURE_FILENAME)' >> gradle.properties
            echo 'SANTOKU_UPLOAD_KEYSTORE_PASSWORD=$(ANDROID_RELEASE_INHOUSE_KEYSTORE_PASSWORD)' >> gradle.properties
            echo 'SANTOKU_UPLOAD_KEY_ALIAS=$(ANDROID_RELEASE_INHOUSE_KEY_ALIAS)' >> gradle.properties
            echo 'SANTOKU_UPLOAD_KEY_PASSWORD=$(ANDROID_RELEASE_INHOUSE_KEY_PASSWORD)' >> gradle.properties
          workingDirectory: '$(appDir)/android'
	  
	  # GradleでAndroidアプリをビルド（AAB形式）
      - task: CmdLine@2
        displayName: "Build Android app for ${{parameters.environment}}"
        inputs:
          script: "fastlane android build_${{parameters.environment}}"
          workingDirectory: "$(appDir)"

      # ビルド成果物をパイプライン成果物として保存
      - task: PublishPipelineArtifact@1
        displayName: "Publish Artifact"
        inputs:
          targetPath: "$(appDir)/android/app/build/outputs"
          artifactType: "pipeline"
          artifactName: "${{parameters.environment}}.aab"
          parallel: true
        condition: succeeded()

      # Google Play Consoleにアップロード
      - task: CmdLine@2
        displayName: "Upload Android app to Google Play Console"
        inputs:
          script: |
            PACKAGE_NAME=$(node -p "require('./config/app.config.${{parameters.environment}}.js')().android.package")
            fastlane android upload_google_play_console \
              aab:"$(appDir)/android/app/build/outputs/bundle/release/app-release.aab" \
              json_key:"$(Agent.TempDirectory)/$(FASTLANE_SUPPLY_JSON_FILE_NAME)" \
              package_name:"$PACKAGE_NAME" \
              track:"internal"
          workingDirectory: "$(appDir)"

trigger: none

parameters:
  - name: environment
    default: prod

variables:
  - name: appDir
    value: "$(System.DefaultWorkingDirectory)"
  - name: npmConfigCache
    value: "$(Pipeline.Workspace)/.npm"

jobs:
  - job: build_${{parameters.environment}}
    displayName: "build ${{parameters.environment}}"
    pool:
      vmImage: macOS-14
    steps:
      # Ruby 3.3をインストール
      - task: UseRubyVersion@0
        inputs:
          versionSpec: "3.3"
          addToPath: true

      # Apple Distribution証明書をインストール（App Store配布用）
      - task: InstallAppleCertificate@2
        displayName: "Install an Apple certificate for ${{parameters.environment}}"
        inputs:
          certSecureFile: $(APPLE_DISTRIBUTION_CERTIFICATE_SECURE_FILENAME)
          certPwd: $(APPLE_DISTRIBUTION_CERTIFICATE_PASSWORD)

      # App Store配布用Provisioning Profileをインストール
      - task: InstallAppleProvisioningProfile@1
        displayName: "Install an Apple provisioning profile for ${{parameters.environment}}"
        inputs:
          provProfileSecureFile: $(APPLE_DISTRIBUTION_PROVISIONING_PROFILE_SECURE_FILENAME)

      # Xcode 16.2を使用するように設定
      - task: CmdLine@2
        displayName: "Use Xcode 16.2"
        inputs:
          script: "sudo xcode-select --switch /Applications/Xcode_16.2.app"

      # Node.js 18.19.0をインストール
      - task: NodeTool@0
        displayName: "Use Node.js 18.19.0"
        inputs:
          versionSpec: "18.19.0"

      # npmのキャッシュを復元して依存関係をインストール
      - task: Cache@2
        displayName: Cache npm
        inputs:
          key: 'npm | "$(Agent.OS)" | $(appDir)/package-lock.json'
          restoreKeys: |
            npm | "$(Agent.OS)"
          path: $(npmConfigCache)

      - task: CmdLine@2
        displayName: "npm ci --cache $(npmConfigCache)"
        inputs:
          script: "npm ci --cache $(npmConfigCache)"
          workingDirectory: "$(appDir)"

      # Gemfile.lockの依存関係をインストール
      - task: CmdLine@2
        displayName: "bundle install"
        inputs:
          script: "bundle install"
          workingDirectory: "$(appDir)"

      # 環境別のFirebase設定ファイルをダウンロード
      - task: DownloadSecureFile@1
        displayName: "Download GoogleServices-Info.plist file for ${{parameters.environment}}"
        inputs:
          secureFile: $(GOOGLE_SERVICES_INFO_PLIST_SECURE_FILENAME)

      # Firebase設定ファイルをプロジェクトルートにコピー
      - task: CopyFiles@2
        displayName: "Copy GoogleService-Info.plist file to: $(appDir)"
        inputs:
          SourceFolder: "$(Agent.TempDirectory)"
          Contents: $(GOOGLE_SERVICES_INFO_PLIST_SECURE_FILENAME)
          TargetFolder: "$(appDir)"

      # Firebase設定ファイルを標準名にリネーム
      - task: CmdLine@2
        displayName: "Rename GoogleService-Info.plist"
        inputs:
          script: |
            /bin/mv $(GOOGLE_SERVICES_INFO_PLIST_SECURE_FILENAME) GoogleService-Info.plist
          workingDirectory: "$(appDir)"

      # Expo prebuildでネイティブiOSプロジェクトを生成
      - task: CmdLine@2
        displayName: "Prebuild iOS app for ${{parameters.environment}}"
        inputs:
          script: "fastlane ios prebuild_${{parameters.environment}}"
          workingDirectory: "$(appDir)"

      # XcodeでiOSアプリをビルド
      - task: CmdLine@2
        displayName: "Build iOS app for ${{parameters.environment}}"
        inputs:
          script: "fastlane ios build_${{parameters.environment}}"
          workingDirectory: "$(appDir)"

      # TestFlightにアップロード（内部テスト用）
      - task: CmdLine@2
        displayName: "Upload TestFlight for ${{parameters.environment}}"
        inputs:
          script: |
            export APPLE_ID=$(APPLE_ID)
            export FASTLANE_APPLE_APPLICATION_SPECIFIC_PASSWORD=$(FASTLANE_APPLE_APPLICATION_SPECIFIC_PASSWORD)
            fastlane ios upload_${{parameters.environment}}_testflight
          workingDirectory: "$(appDir)"

      # ビルド成果物をパイプライン成果物として保存
      - task: PublishPipelineArtifact@1
        displayName: "Publish Artifact"
        inputs:
          targetPath: "$(appDir)/ios/build"
          artifactType: "pipeline"
          artifactName: "app.ipa"
          parallel: true
        condition: succeeded()