Edited at

Node(Angular)-> Firebase開発環境のCircleCIの設定ファイル、これでひとまず大丈夫!


Node.js開発環境のCI/CDファイル(CircleCi用)

やっていること

1.成功した場合にSlackに通知するように

2.MasterブランチとReleaseブランチ分けて処理

3.Masterブランチはbuildのみ

4.Releaseブランチはbuildで成功後、FirebaseにDeployする(GAEなど置き換えのもあり)

5.キャッシュ再利用

注意

1.Firebaseの環境はこちらで構築したですが、

npm install --save-dev firebase-tools

$FIREBASE_PROJECT_ID

$FIREBASE_TOKEN

をCircleciの設定するが必要です。

GAEには別のコマンドで構築できます。

2.SLACK_WEB_HOOKはslackに通知用のkeyで、slackのincomingWebhookからtoken取得し、Circleciに設定してください。この内容を割愛します。

version: 2

jobs:
build:
docker:
- image: circleci/node:9.11.1-stretch-browsers
working_directory: ~/repo
steps:
- checkout
- restore_cache:
keys:
- v1-dependencies-{{ checksum "package.json" }}
- v1-dependencies-
- run: echo "Start lint & build "
- run: npm install
- save_cache:
paths:
- node_modules
key: v1-dependencies-{{ checksum "package.json" }}
- run: npm run-script lint
- run: npm run-script build-prod
test:
docker:
- image: circleci/node:9.11.1-stretch-browsers
steps:
- checkout
- run: echo "Start test"
- run: npm install
- run: npm run-script test-single
deploy:
docker:
- image: circleci/node:9.11.1-stretch-browsers
steps:
- checkout
- run: echo "Start deploy"
- run:
name: "Push to Slack"
command: curl -X POST --data-urlencode "payload={\"username\":\"circleCI\",\"text\":\"Firebaseにデプロイします。\",\"icon_emoji\":\":ghost:\"}" "${SLACK_WEB_HOOK}"
- run: npm install --save-dev firebase-tools
- run: npm run-script build-prod
- run:
name: 'Deploy to Hosting'
command: node_modules/.bin/firebase deploy --only hosting --project "$FIREBASE_PROJECT_ID" --token "$FIREBASE_TOKEN"
- run:
name: "Push to Slack Finish"
command: curl -X POST --data-urlencode "payload={\"username\":\"circleCI\",\"text\":\"Firebaseにデプロイしました!\",\"icon_emoji\":\":ghost:\"}" "${SLACK_WEB_HOOK}"
workflows:
version: 2
build_deploy:
jobs:
- build
- deploy:
requires:
- build
filters:
branches:
only: release

Angularで開発のpackage.jsonのscriptの一例

"start": "ng serve"

"build": "ng build"

"build-prod": "ng build --prod"

"test": "ng test"

"test-single": "ng test --single-run"

"lint": "ng lint"