Node.js - JavaScript チュートリアル

ここでは、Node.js サンプル アプリケーションの .circleci/config.yml ファイルを作成する方法を詳細に説明します。

クイックスタート: デモ用の JavaScript Node.js リファレンス プロジェクト

CircleCI 2.1 で Express.js アプリケーションをビルドする方法を示すために、JavaScript Node.js リファレンス プロジェクトが用意されています。

このプロジェクトには、CircleCI 設定ファイル .circleci/config.yml が含まれます。 このファイルは、Node プロジェクトで CircleCI 2.1 を使用するためのベスト プラクティスを示しています。

CircleCI のビルド済み Docker イメージ

CircleCI のビルド済みイメージを使用することをお勧めします。このイメージには、CI 環境で役立つツールがプリインストールされています。 Docker Hub (https://hub.docker.com/r/circleci/node/) から必要な Node バージョンを選択できます。 デモ プロジェクトでは、公式 CircleCI イメージを使用しています。

セカンダリ「サービス」コンテナとして使用するデータベース イメージも提供されています。

JavaScript Node のデモ プロジェクトのビルド

CircleCI を初めて使用する際は、プロジェクトをご自身でビルドしてみることをお勧めします。 以下に、ユーザー自身のアカウントを使用してデモ プロジェクトをビルドする方法を示します。

  1. GitHub 上のプロジェクトをお使いのアカウントにフォークします。
  2. CircleCI で [Add Projects (プロジェクトの追加)] ページにアクセスし、フォークしたプロジェクトの横にある [Build Project (プロジェクトのビルド)] ボタンをクリックします。
  3. 変更を加えるには、.circleci/config.yml ファイルを編集してコミットします。 コミットを GitHub にプッシュすると、CircleCI がそのプロジェクトをビルドしてテストします。

設定ファイルの例

以下に、デモ プロジェクトのコメント付き .circleci/config.yml ファイルを示します。

version: 2.1 # CircleCI 2.1 を使用します
jobs: # 一連のステップ
  build: # ワークフローを使用しない実行では、エントリポイントとして `build` ジョブが必要です
    working_directory: ~/mern-starter # ステップが実行されるディレクトリ
    docker: # Docker でステップを実行します

      - image: circleci/node:10.16.3 # このイメージをすべての `steps` が実行されるプライマリ コンテナとして使用します
      - image: mongo:4.2.0 # このイメージをセカンダリ サービス コンテナとして使用します
    steps: # 実行可能コマンドの集合
      - checkout # ソース コードを作業ディレクトリにチェックアウトする特別なステップ
      - run:
          name: update-npm
          command: 'sudo npm install -g npm@latest'
      - restore_cache: # 依存関係キャッシュを復元する特別なステップ
          # 依存関係キャッシュについては https://circleci.com/ja/docs/2.0/caching/ をお読みください
          key: dependency-cache-{{ checksum "package-lock.json" }}
      - run:
          name: install-npm-wee
          command: npm install
      - save_cache: # 依存関係キャッシュを保存する特別なステップ
          key: dependency-cache-{{ checksum "package-lock.json" }}
          paths:
            - ./node_modules
      - run: # テストを実行します
          name: test
          command: npm test
      - run: # カバレッジ レポートを実行します
          name: code-coverage
          command: './node_modules/.bin/nyc report --reporter=text-lcov'
      - store_artifacts: # テスト結果をアーティファクトとして保存する特別なステップ
          # アーティファクト (https://circleci.com/ja/docs/2.0/artifacts/) に表示するテスト サマリーをアップロードします 
          path: test-results.xml
          prefix: tests
      - store_artifacts: # アーティファクト (https://circleci.com/ja/docs/2.0/artifacts/) に表示するため
          path: coverage
          prefix: coverage
      - store_test_results: # テスト サマリー (https://circleci.com/ja/docs/2.0/collect-test-data/) に表示するため
          path: test-results.xml
      # デプロイ例については https://circleci.com/ja/docs/2.0/deployment-integrations/ を参照してください

##

設定ファイルの詳細

config.yml は必ず version キーから始めます。 このキーは、互換性を損なう変更に関する警告を表示するために使用します。

version: 2.1

実行処理は 1 つ以上のジョブで構成されます。 この実行では ワークフローを使用しないため、build ジョブを記述する必要があります。

working_directory キーを使用して、ジョブの steps を実行する場所を指定します。 working_directory のデフォルトの値は ~/project です (project は文字列リテラル)。

ジョブの各ステップは Executor という仮想環境で実行されます。

この例では docker Executor を使用して、カスタム Docker イメージを指定しています。 最初に記述したイメージが、ジョブのプライマリ コンテナになります。 ジョブのすべてのコマンドがこのコンテナで実行されます。

jobs:
  build:
    working_directory: ~/mern-starter
    docker:
      - image: circleci/node:4.8.2
      - image: mongo:3.4.4

ジョブのコンテナを選択したら、いくつかのコマンドを実行する steps を作成します。

checkout ステップを使用して、ソース コードをチェックアウトします。 デフォルトでは、working_directory で指定されたパスにソース コードがチェックアウトされます。

実行の間隔を短縮するには、依存関係またはソース コードのキャッシュを検討してください。

save_cache ステップを使用して、いくつかのファイルまたはディレクトリをキャッシュします。 この例では、package-lock.json のチェックサムをキャッシュキーとして使用して、node_modules をキャッシュします。

restore_cache ステップを使用して、キャッシュされたファイルまたはディレクトリを復元します。

    steps:

      - checkout
      - run:
          name: update-npm
          command: 'sudo npm install -g npm@latest'
      - restore_cache:
          key: dependency-cache-{{ checksum "package-lock.json" }}
      - run:
          name: install-npm-wee
          command: npm install
      - save_cache:
          key: dependency-cache-{{ checksum "package-lock.json" }}
          paths:
            - ./node_modules

依存関係がインストールされたので、テスト スイートを実行し、テスト結果をアーティファクトとしてアップロードできます (CircleCI Web アプリで使用できるようになります)。

      - run:
          name: test
          command: npm test
      - run:
          name: code-coverage
          command: './node_modules/.bin/nyc report --reporter=text-lcov'
      - store_artifacts:
          path: test-results.xml
          prefix: tests
      - store_artifacts:
          path: coverage
          prefix: coverage
      - store_test_results:
          path: test-results.xml

完了です。 これで Node.js アプリケーション用に CircleCI 2.1 をセットアップできました。CircleCI でビルドを行うとどのように表示されるかについては、プロジェクトのジョブ ページを参照してください。

関連項目