Error while deploying Angular 7 app on AWS S3 using codepipeline

Question

I want to deploy Angular 7 app(as static website) on S3 automatically using AWS Code pipeline. I have created Angular app and pushed to my git repo. I have created new AWS S3 bucket and created AWS Codepipline and integrated git repo

I am getting below error when aws code-pipelineb uilds the app: COMMAND_EXECUTION_ERROR: Error while executing command: ng build. Reason: exit status 1

I am using buildspect.yml file

version: 0.2

env:
    variables:
        S3_BUCKET: "<bucket name>"
        BUILD_ENV : "prod"

phases:
    install:
        runtime-versions:
            nodejs: 10
        commands:
            # install dependencies
            - echo Installng source NPM dependencies...
            - npm install npm@latest -g
            - npm install -g @angular/cli

    pre_build:
        commands:
            - echo Prebuild steps
            - npm install

    build:
        commands:
            # Builds Angular application. You can also build using custom environment here like mock or staging
            - echo Build started on `date`
            - ng build

    post_build:
        commands:
            # Clear S3 bucket.
            - aws s3 rm s3://${S3_BUCKET} --recursive
            - echo S3 bucket is cleared.
            # Copy dist folder to S3 bucket, As of Angular 6, builds are stored inside an app folder in distribution and not at the root of the dist folder
            - aws s3 cp dist s3://${S3_BUCKET} --recursive
            - echo Build completed on `date`

artifacts:
    files:
        - '/'
    discard-paths: yes
    base-directory: 'dist*'

I feel that code-build environment is not properly configured. I mean Nodejs and npm is not installed correctly. Please go through above yml file and help me identify if I am missing anything.

Answer 1

You are missing the build environment in your Buildspec.yml file.

Add this piece in and check if this helps -

build:
    commands:
        # Builds Angular application. You can also build using custom environment here like mock or staging
        - echo Build started on `date`
        - ng build --${BUILD_ENV}

This works for me perfectly!

Answer 2

This yml file worked perfectly fine for me :

version: 0.2

env:
    variables:
        S3_BUCKET: "pratik-portfolio"
phases:
install:
    runtime-versions:
        nodejs: 10
    commands:
    - echo $CODEBUILD_SRC_DIR
    - npm install -y npm@latest
    - npm install -g @angular/cli
    - rm package-lock.json
pre_build:
    commands:
    - npm install
build:
    commands:
    - echo build started on `date`
    - ng build
    - ls -l -F
post_build:
    commands:
            # Clear S3 bucket.
            - aws s3 rm s3://${S3_BUCKET} --recursive
            - echo S3 bucket is cleared.
            - aws s3 cp dist/{Your app name} s3://${S3_BUCKET} --recursive
            - echo Build completed on `date`
artifacts:
    files:
        - '/'
    discard-paths: yes
    base-directory: 'dist*'
cache:
paths:
    - node_modules/