How do you configure a sequential workflow on CircleCI 2.0? - react-native

I've added a config.yml file to a react-native project in the .circleci/ directory in order to configure a build pipeline.
But in my CircleCI 2.0 server only the first job, build runs while test and android don't run although they are part of the overall workflow config.
I've followed the workflow configuration guide here https://circleci.com/docs/2.0/workflows/ to configure a sequential workflow.
I did verify that my CI server is using the config below
Question:
How do you configure a sequential workflow on CircleCI 2.0?
config.yml file in repo:
# Javascript Node CircleCI 2.0 configuration file
#
# Check https://circleci.com/docs/2.0/language-javascript/ for more details
#
version: 2
machine:
environment:
PATH: "${PATH}:${HOME}/${CIRCLE_PROJECT_REPONAME}/node_modules/.bin"
dependencies:
override:
- yarn
- jest
cache_directories:
- ~/.cache/yarn
- ~/.cache/jest
build:
override:
- yarn install
jobs:
build:
working_directory: ~/repo
docker:
- image: circleci/node:8
steps:
- checkout
- run: yarn install
- persist_to_workspace:
root: ~/repo
paths:
- node_modules
test:
working_directory: ~/repo
docker:
- image: circleci/node:8.9.0
steps:
- checkout
- run: yarn install
- run: npm test
- persist_to_workspace:
root: ~/repo
paths:
- node_modules
android:
working_directory: ~/repo/android
docker:
- image: circleci/android:api-27-node8-alpha
steps:
- checkout:
path: ~/repo
- attach_workspace:
at: ~/repo
- run: bundle install
#- run: bundle exec fastlane test
- store_test_results:
path: ~/root/android/reports
workflows:
version: 2
node-android:
jobs:
- build:
filters:
tags:
ignore: /^testing
- test
requires:
- test
- android:
requires:
- test
- build

I fixed the workflow by removing the CI 1.0 syntax as #FelicianoTech mentioend, this piece of YAML is not 2.0 CircleCI syntax:
machine:
environment:
PATH: "${PATH}:${HOME}/${CIRCLE_PROJECT_REPONAME}/node_modules/.bin"
dependencies:
override:
- yarn
- jest
cache_directories:
- ~/.cache/yarn
- ~/.cache/jest
build:
override:
- yarn install

Related

Increase the NPM Package version automatically

I am creating my own NPM packages for the first time. For each commit, 1/ The package version should increase on the NPM registry, 2/ Update the package.json file in the github repository.
.github/workflows/publish.yml
on:
push:
branches:
- main
env:
version: 0
jobs:
build:
runs-on: ubuntu-latest
permissions:
contents: read
packages: write
steps:
- uses: AutoModality/action-clean#v1
- uses: actions/checkout#v2
with:
ref: 'main'
fetch-depth: 0
- uses: actions/setup-node#v2
with:
node-version: 12
registry-url: https://npm.pkg.github.com/
scope: "#nandhirajan-tfi"
- run: echo "version=$(npm show #nandhirajan-tfi/my-package version)" >> $GITHUB_ENV
- run: npm version ${{env.version}} --no-git-tag-version --allow-same-version
- run: npm install
- run: npm build
- run: npm version patch -m "[RELEASE] %s" --no-git-tag-version --allow-same-version
- run: npm publish
env:
credentials: ${{secrets.GITHUB_TOKEN}}
GitHub Actions Output:
The above log says that the npm publish command has updated the NPM Version to 1.11.18. But the changes are not reflecting on the NPM registry.
Any help would be appreciated.
First of all you need to retrieve your package.json version. You can use the action ga-project-version for that.
Example:
name: release
on:
push:
branches: [ main ]
jobs:
build:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout#v2
# This is how you use the ga-project-version action
- name: Get version of the project
id: project-version
uses: 'euberdeveloper/ga-project-version#main'
# In this step the exposed version is used as tag of a github release to publish
- name: Add release
uses: "marvinpinto/action-automatic-releases#latest"
with:
repo_token: "${{ secrets.GITHUB_TOKEN }}"
# This is how you access the exposed version
automatic_release_tag: "${{ steps.project-version.outputs.version }}"
title: "Deploy"
files: |
backend.tar.gz
As you can see, you will have the version available in "${{ steps.project-version.outputs.version }}".
After that the question is with which logic you will augment your version, e.g. the simplest one would be increasing the last number, but it's not a good idea, it'd not be semver.
After that you can use your custom way to get the newer version by using the current one as input ("${{ steps.project-version.outputs.version }}"`).
After having the new version, just edit the package.json (e.g. sed command) to write the new version, and commit it (e.g. stefanzweifel/git-auto-commit-action action).
In the end you can publish your npm package from the github action (follow this link)

Upload 'ng build' to S3 Bucket

I am trying to upload my angular-meteor project's 'ng build' to S3 Bucket.
This is my .yml file
on:
push:
branches:
- dev
jobs:
build:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout#v1
- name: Setup meteor
uses: meteorengineer/setup-meteor#v1
with:
meteor-release: '1.8.1'
- name: Install Node.js
uses: actions/setup-node#v1
with:
node-version: '10.x'
- name: NG build Angular
run: ng build --prod
- name: Deploy to S3
uses: jakejarvis/s3-sync-action#master
with:
args: --acl public-read --delete
env:
AWS_S3_BUCKET: ${{ secrets.DEV_AWS_S3_BUCKET }}
AWS_ACCESS_KEY_ID: ${{ secrets.AWS_ACCESS_KEY_ID }}
AWS_SECRET_ACCESS_KEY: ${{ secrets.AWS_SECRET_ACCESS_KEY }}
AWS_REGION: ${{ secrets.AWS_REGION }}
SOURCE_DIR: 'browser'
Once I run this, I am receiving this error message for the NG build Angular section
Instead of running ng build --prod i have also tried to run ng build — prod — aot, ng build -- --prod & npm run build -- --prod but Still I am receiving the same error message.
Does anyone know how to solve this problem?
By default GitHub runners won't have ng/angular cli. So we got to install it . Below piece of code should do the job for you.
on:
push:
branches:
- dev
jobs:
build:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout#v1
- name: Setup meteor
uses: meteorengineer/setup-meteor#v1
with:
meteor-release: '1.8.1'
- name: Install Node.js
uses: actions/setup-node#v1
with:
node-version: '10.x'
- name: Install Angular CLI
run: npm install -g #angular/cli
- name: NG build Angular
run: ng build --prod
- name: Deploy to S3
uses: jakejarvis/s3-sync-action#master
with:
args: --acl public-read --delete
#angular/cli is installed as a devDependency, so you have to use:
- name: NG build Angular
run: npx ng build --prod
or in Angular 12+
- name: NG build Angular
run: npx ng build --configuration production

GitHub Actions Upload Artifact not finding provided path from npm run build

I'm trying to set up a react website using CICD principles. I can run it locally, use 'npm run build' to get a build folder, and the website works fine when I manually push the files to S3. However, when I try to run the build and deployment through github actions, the upload-artifacts step gives the following warning: 'Warning: No files were found with the provided path: build. No artifacts will be uploaded.' Obviously the deploy job then fails since it can't find any artifacts to download. Why exactly is this happening? The build folder is definitely being created since running ls after the build lists it as one of the folders in the current working directory.
name: frontend_actions
on:
workflow_dispatch:
push:
paths:
- 'frontend/'
- '.github/workflows/frontend_actions.yml'
branches:
- master
defaults:
run:
working-directory: frontend
jobs:
build:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout#v2
- uses: actions/setup-node#v2
- name: npm install
run: npm install
- name: npm build
run: npm run build
env:
CI: false
- name: Upload Artifact
uses: actions/upload-artifact#master
with:
name: build
path: build
deploy:
needs: build
runs-on: ubuntu-latest
steps:
- uses: actions/checkout#v2
- name: Download Artifact
uses: actions/download-artifact#master
with:
name: build
path: build
- name: Deploy to S3
uses: jakejarvis/s3-sync-action#master
with:
args: --acl public-read --follow-symlinks --delete
env:
AWS_S3_BUCKET: ${{ secrets.AWS_S3_BUCKET }}
AWS_ACCESS_KEY_ID: ${{ secrets.AWS_ACCESS_KEY_ID }}
AWS_SECRET_ACCESS_KEY: ${{ secrets.AWS_SECRET_ACCESS_KEY }}
AWS_REGION: 'us-west-2' # optional: defaults to us-east-1
SOURCE_DIR: 'build' # optional: defaults to entire repository
It turns out that my knowledge of github actions was incomplete. When setting a default working directory for jobs, the default directory is only used by commands that use 'run'. Hence all of the 'uses' actions are run in the base directory. I guess I've never encountered this issue since I've never tried uploading/downloading artifacts that weren't created in a base github directory.
Fixed the issue by changing the path from 'build/' to 'frontend/build'.

GitHub Action: Deploy output of vue-cli-service build to Azure App Service

I'm using a GitHub action to deploy to Azure App Service, and, although the npm build succeeds, I cannot figure out how to get the output of that build to be deployed along with the output of the .NET build.
As you can see in my workflow file, for the .NET build, I specified --output ./deploy and then at the bottom, that is deployed via package: './deploy'
However I don't know how to get the npm build output into './deploy'. Currently, the npm build places the output into ClientApp/dist, according to vue.config.js.
Vue config relevant line: outputDir: path.resolve(__dirname, "ClientApp/dist")
Entire action workflow file:
name: CI
on:
push:
branches: [ master ]
jobs:
build-all:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout#v2
- uses: actions/setup-dotnet#v1
env:
DOTNET_CLI_TELEMETRY_OPTOUT: 1
with:
dotnet-version: '5.0.x'
- run: dotnet build ./source/trunk/my/project.csproj --output ./deploy
- name: Frontend build
working-directory: ./source/trunk/my/project
run: |
npm install
npm install #vue/cli-service
npx -p #vue/cli vue-cli-service build --mode development
- name: Azure login
uses: azure/login#v1.1
with:
creds: ${{ secrets.MY_SECRET}}
enable-AzPSSession: false
- name: Azure deploy
uses: azure/webapps-deploy#v2
with:
app-name: my-app-name
package: './deploy'

How to do a single build with GitLab for Vue application with multiple .env files

I have a simple .gitlab-ci.yml file that builds my Vue application. I build once and then deploy the dist folder to my various environments:
stages:
- build
- deploy_dev
- deploy_stg
- deploy_prd
build:
image: node:latest # Pull Node image
stage: build
script:
- npm install -g #vue/cli#latest
- npm install
- npm run build
artifacts:
expire_in: 2 weeks
paths:
- dist/
deploy_to_dev:
image: python:latest
stage: deploy_dev
dependencies:
- build
only:
- master # Only deply master branch automatically to Dev
script:
- export AWS_ACCESS_KEY_ID=$DEV_AWS_ACCESS_ID
- export AWS_SECRET_ACCESS_KEY=$DEV_AWS_ACCESS_KEY
- pip install awscli # Install AWS CLI
- aws s3 sync ./dist s3://$DEV_BUCKET
This all works great, however, I've now introduced some config and build my app differently per environment - for 3 environments I have 3 different build commands. Eg, I have an .env.production so for a production build my command becomes:
npm run build -- --mode production
Is there any way to get around having different builds for each environment but still using the .env files based on a GitLab variable?
You should split your build job to have one per environment and use the environment concept to have something like that for dev and production envs :
.build_template: &build_template
image: node:latest # Pull Node image
script:
- npm install -g #vue/cli#latest
- npm install
- npm run build -- --mode $CI_ENVIRONMENT_NAME
build_dev:
stage: build_dev
<<: *build_template
environment:
name: dev
build_prod:
stage: build_prod
<<: *build_template
environment:
name: production
In this snippet, I used anchors to avoid duplicate lines.