How to upload a generated folder content into S3 using CodeBuild? - amazon-web-services

I am trying to configure a CodePipeline on AWS that it takes my Nuxt website on Github, run the command npm run generate to generate the static website then upload the dist folder on an S3 bucket.
Here what my buildspec.yml it looks like:
version: 0.2
phases:
install:
commands:
- npm install
build:
commands:
- npm run generate
post_build:
commands:
- aws s3 sync dist $S3_BUCKET
The error I get is: The user-provided path dist does not exist. Is anyone know how to correct this? I read a lot about artefacts but I never use them beforeā€¦
Thanks in advance,

You can use artifacts to upload dist folder to s3. I will suggest not to use post build command to achieve this because the post build command runs even when the build is failed, this is the known limitation of codebuild. Just replace your buildspec with the following.
version: 0.2
phases:
install:
commands:
- npm install
build:
commands:
- npm run generate
artifacts:
files:
- '**/*'
base-directory: 'dist'
'**/*' means it will upload all the files and folder under the base directory "dist". You need to mention your bucket name in your aws console ( browser).
Also make sure that your codebuild IAM role has sufficient permission to access your bucket.

Related

How I can deploy a subfolder into my bucket's root path?

For my react App I use the following buildspec.yml to deploy a reast Single Page Application:
version: 0.2
phases:
pre_build:
commands:
- npm install
build:
commands:
- npm run build
cache:
paths:
- /root/.npm/**/*
artifacts:
files:
- ./build/**
I also created an s3 bucket as static website and I deploy it directly via codeploy. But the folder that is deployed is into the ./build istead of the bucket's root. Is there a way to translate the paths of the codebuild's output artifacts into the deployed paths?
The codebuild path is used as a step in a codepipeline.
In order to do that you must specify a base-directory then tell the codebuild to set everything as artifact. This would be your final buildspec.yml:
version: 0.2
phases:
pre_build:
commands:
- npm install
build:
commands:
- npm run build
cache:
paths:
- /root/.npm/**/*
artifacts:
files:
- '**/*'
base-directory: './build'
And you also can safely delete the rogue ./build folder into your s3 bucket.

How to configure AWS Codebuild with Webpack

I have created an AWS Codepipeline that runs in four stages. 1) Source code from github, 2) deploy backend to Elastic Beanstalk, 3) build fronted code with Codebuild (using the buildspec file below), and 4) deploy results of webpack to S3.
Everything works as expected so far except for the results of stage 3. Codebuild seemingly sets the artifacts as the source files and not the results of the webpack build. When I look in the bucket and folder for the deployed code, I'm expecting to see a series of js asset files and a manifest.json. Instead, I see the project files. Not quite sure what I'm configuring wrong here.
buildspec.yml
version: 0.2
phases:
install:
runtime-versions:
nodejs: 12
commands:
- echo Installing dependencies...
- yarn
build:
commands:
- echo Building project...
- yarn build
post_build:
commands:
- echo build completed on `date`
artifacts:
files:
- '**/*'
cache:
paths:
- '/root/.npm/**/*'
- '/node_modules/'
webpack-build configuration
webpack-deploy configuration
After a few hours of troubleshooting, I was finally able to figure out what was going on.
Running yarn build on the project bundles everything into a /dist folder. The artifacts line, however, indicates that the files that should be uploaded to S3 are all of the project files. So the fix was as simple as updating **/* to dist/**/*.

CodeBuild pushes source React files to s3 instead of the build folder

im using CodePipeline with CodeBuild together with a github repository.
CodeBuild builds the project successfully, but he uploads the source react folder like the whole repository without any build folder to S3.
My buildspec.yaml looks like this:
version: 0.2
phases:
build:
commands:
- echo "Installing dependicies..."
- npm install
- echo "Create the build..."
- npm run build
artifacts:
files:
- '**/*'
base-directory: 'build'
What can I do ?

Using codepipeline to create a build and deploy it in aws s3

I have created a codepipeline in aws that creates the build and copies the dist folder in my aws s3. I am able to save all the files inside the dist folder but assets folder is not saving. What should be the buildspec.yml file to copy assets folder in s3.
version: 0.2
env:
variables:
S3_BUCKET: bucketName
APP_NAME: "Walter"
BUILD_ENV : "prod"
phases:
install:
commands:
- echo Installing source NPM dependencies...
- npm install
- npm install -g #angular/cli
build:
commands:
# Builds Angular application. You can also build using custom environment here like mock or staging
- echo Build change this started on this fg date `date`
- ng build --${BUILD_ENV}
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/walter s3://${S3_BUCKET}/${APP_NAME} --recursive
- echo Build completed on `date`
artifacts:
files:
- '**/*'
discard-paths: yes
base-directory: 'dist/Walter'
For someone looking to achieve this. I solved it by changing the 'discard-paths' value to 'no'.
Setting its value to 'yes' neglects the folder structure and copies all the files to the specified location. With setting it to 'no', it maintains the folder structure.

AWS CodePipeline successful, but not correctly deployed to Elastic Beanstalk

The (successful) deployment of my WAR file to Elastic Beanstalk gives me a 404 Not Found when I invoke the application URL. I can see a application.war file within /var/lib/tomcat8/webapps/ROOT/ instead of META-INF and WEB-INF, which is in there when I deploy manually.
When I pull the WAR file from S3 and deploy it to Elastic Beanstalk manually it works like a charm. Note: this is the same WAR file as generated by CodeBuild in my pipeline. Even better, if I secure copy (scp) the file to my local computer and upload it to Elastic Beanstalk it works as well.
It seems that everything works until the deployment, a working WAR file is even deployed to Elastic Beanstalk.
Going through eb-activity.log I can see it recognizes the WAR file and deploys it from a temporary directory to /var/lib/tomcat8/webapps/ROOT, but it isn't unpacked and the container/webserver isn't restarted.
How can I correctly deploy the WAR file with CodePipeline?
It seems that almost three years later AWS Codepipeline is not yet "WAR file deployment friendly". As pointed out in the comment by #Azeq the standard Elastic Beanstalk deployment procedure won't unzip the war file and nothing will be really deployed. CodePipeline reports success because the copy of the files is made without errors but Tomcat won't unzip the war file.
The solution is to provide your artifact in exploded form (already unzipped). To do so modify the post build phase and the artifact definiton of your CodeBuild buildspec.yml:
version: 0.2
phases:
install:
runtime-versions:
java: openjdk8
pre_build:
commands:
- echo CODEBUILD_RESOLVED_SOURCE_VERSION $CODEBUILD_RESOLVED_SOURCE_VERSION
build:
commands:
- mvn compile
post_build:
commands:
- mvn package
- mkdir artifact <-- create folder to extract war file content
- unzip target/my.war -d artifact/ <-- unzip to that folder
artifacts:
files:
- artifact/**/* <-- reference all those files as the artifact
name: artifact
cache:
paths:
- '/root/.m2/**/*'
Note the mkdir and unzip commands in the post build phase, and how the files definition in the artifacts section is written. As per CodeBuild documentation, **/* means all files recursively.
I tried to replicate the issue which you are facing. I think when creating the "war" file, you are putting the folder, which contains the "META-INF" and "WEB-INF" folders, as the root of the "war" output file.
Instead, you should put all the files (within the folder above) in the "war" file without the root-level folder.
I struggled with this for a while as well. Finally I was able to resolve it by having the buildspec.yml extract the WEB-INF directory from the built war file in the post_build section
Since AWS places a zip wrapper around your artifact it adds another folder level around what elasticbeanstalk actually needs
version: 0.2
phases:
install:
runtime-versions:
java: corretto11
build:
commands:
- mvn compile
post_build:
commands:
- mvn package
- mkdir artifact
- unzip target/demo-0.0.1-SNAPSHOT.war -d artifact/
- mv artifact/WEB-INF WEB-INF
artifacts:
files:
- WEB-INF/**/*
name: artifact