Failure in build using Travis, AWS Elasticbeanstalk and Docker - reactjs

I am facing an issue while building my React project using GitHub as a repository, Travis as CI with AWS ElasticBeanStalk as a service to run my app using Docker. I am able to run my test suite but after that, it is not deploying my app on AWS and also not getting any error in Travis console except below:
Below is my Travis .yml file configuration:
language: generic
services:
- docker
before_install:
- docker build -t heet1996/my-profile -f Dockerfile.dev .
script:
- docker run heet1996/my-profile npm run test -- --coverage
deploy:
provider: elasticbeanstalk
region: "us-east-1"
app: "My-profile"
env: "MyProfile-env"
bucket_name: "elasticbeanstalk-us-east-1-413920612934"
bucket_path: "My-profile"
on:
branch: master
access_key_id: $AWS_ACCESS_KEY
secret_access_key: "$AWS_SECRET_KEY"
Let me know if you need more information

A couple things you could try:
Your script command needs to set the environment var CI=true
So
script:
- docker run heet1996/my-profile npm run test -- --coverage
Becomes
script:
- docker run -e CI=true heet1996/my-profile npm run test -- --coverage
Also AWS needs the access variables to be named differently.
Change
access_key_id: $AWS_ACCESS_KEY
secret_access_key: "$AWS_SECRET_KEY"
To
access_key_id: "$AWS_ACCESS_KEY_ID"
secret_access_key: "$AWS_SECRET_ACCESS_KEY"

Using the option --coverage, your test will hang, waiting for input. Hence the message: "...no output has been received in the last 10m0s...".
At a certain point, --coverage was probably able to stop tests (as some used for that purpose), but I guess it was not meant for that and subsequent versions of docker removed that behavior.
Your test must conclude and the conclusion be a success for the deployment by Travis to begin.
Use instead the option --watchAll=false. So you should have:
...
script:
- docker run heet1996/my-profile npm run test -- --watchAll=false
...
That would take care of the obvious issue of your test never concluding (that could be the only issue). Afterward, make sure that your tests are successful. Then, you can worry about other issues such as authentication on AWS, etc...

Related

serve React build locally

I am currently learning React, to eventually pair with Ruby on Rails.
I am following the tutorial:
https://www.youtube.com/watch?v=w7ejDZ8SWv8
to get a handle on the language.
I have successfully compiled the build folder, running the command $ npm run build
I have also run the command $ sudo npm i -g serve in my terminal to install the npm serve
when running the build on localhost:8000, using the command $ serve - s -p 8000 in the terminal, it is serving using WEBrick::HTTPServer, throwing the following up in the terminal:
[2022-09-12 15:03:22] INFO WEBrick 1.7.0
[2022-09-12 15:03:22] INFO ruby 3.0.0 (2020-12-25) [x86_64-darwin19]
[2022-09-12 15:03:22] INFO WEBrick::HTTPServer#start: pid=5412 port=8000
which results in localhost:8000 showing:
My question:
Is there a way of altering this so I can serve my react build successfully, without causing issues when I go back to serving my RoR applications later?

Running react-snap on AWS codebuild

I have a react website that I host on AWS. I have created code pipeline in AWS that connects to my github, which automatically builds the projects using codeBuild and deploys it to S3.
I'm trying to add react-snap to the project. It works well locally but when I try to build it in codebuild I get this error
Error: Failed to launch chrome!
/codebuild/output/src159566889/src/node_modules/puppeteer/.local-chromium/linux-686378/chrome-linux/chrome: error while loading shared libraries: libXss.so.1: cannot open shared object file: No such file or directory
TROUBLESHOOTING: https://github.com/GoogleChrome/puppeteer/blob/master/docs/troubleshooting.md
at onClose (/codebuild/output/src159566889/src/node_modules/puppeteer/lib/Launcher.js:348:14)
at Interface.<anonymous> (/codebuild/output/src159566889/src/node_modules/puppeteer/lib/Launcher.js:337:50)
at Interface.emit (events.js:326:22)
at Interface.close (readline.js:416:8)
at Socket.onend (readline.js:194:10)
at Socket.emit (events.js:326:22)
at endReadableNT (_stream_readable.js:1241:12)
at processTicksAndRejections (internal/process/task_queues.js:84:21)
error Command failed with exit code 1.
I have tried to google it but I didn't find anything specific to codebuild and react-snap. I have found similar questions in regards to running chrome on codebuild but they related to different environments like angular and so I wasn't able to copy their solutions.
This is what my current buildspec.yaml file looks like
version: 0.2
env:
variables:
S3_BUCKET: "xyz"
STAGE: "beta"
phases:
install:
commands:
- yarn install
build:
commands:
- echo "Building for $STAGE"
- yarn build
- sam package --template-file cloudformation/Root.json --s3-bucket ${S3_BUCKET} --s3-prefix WebsiteCF/${CODEBUILD_RESOLVED_SOURCE_VERSION} --output-template-file build/packaged-template.yaml
artifacts:
files:
- '**/*'
base-directory: 'build'
Based on the instruction on the link provided by the error, I tried adding this but it didn't work
install:
commands:
- PYTHON=python2 amazon-linux-extras install epel -y
- yum install -y chromium
- yarn install
I managed to get it working using these steps:
Make sure your AWS code builder is using aws/codebuild/standard:5.0
Go t AWS code builder -> Edit -> Environment -> Override image
Create a addArgs.sh file to your project with this content
# modifies react-snap defaultOptions to add the --no-sandbox and --disable-setuid-sandbox flags so that puppeteer/chromium can run in the codebuild standard image
sed -i "s/puppeteerArgs: \[\],/puppeteerArgs: \[\"--no-sandbox\", \"--disable-setuid-sandbox\"\],/" ./node_modules/react-snap/index.js
echo changed arguments in react-snap
To your buildspec.yml file, add these lines to the install stage
# Install chrome headless
- apt-get -y update
- apt-get --assume-yes install chromium-browser
- sh ./addArgs.sh # run custom script to change options on react-snap to make it work
I found the answer from here - https://github.com/stereobooster/react-snap/issues/122

GitLab CI Pipeline Job gives error JavaScript heap out of memory

We have a WordPress plugin written in JS with the help of the tool wp-reactivate.
Our goal is to make a GitLab CI Pipeline that increases the version in all places, builds the project and deploys it to the WordPress.org SVN repository. So far, the SVN deployment does work, incrementing the version number is unimplemented yet, but we have a problem building the project. The GitLab CI Runner refuses to finish the process since it ran out of available memory.
We have already tried (with no effect):
Setting GENERATE_SOURCEMAP=false
Setting NODE_OPTIONS="--max_old_space_size=8192"
Running node --max-old-space-size=8192
Our .gitlab-ci.yml file:
stages:
- build
- deploy
default:
image: node
BuildApp:
stage: build
before_script:
- GENERATE_SOURCEMAP=false
- NODE_OPTIONS=\"--max_old_space_size=8192\"
- node --max-old-space-size=8192
script:
- yarn
- yarn prod
PluginSVN:
stage: deploy
before_script:
- apt-get install subversion
- curl -o /usr/bin/deploy.sh https://git-cdn.e15r.co/open-source/wp-org-plugin-deploy/raw/master/scripts/deploy.sh
- chmod +x /usr/bin/deploy.sh
script: /usr/bin/deploy.sh
when: on_success
Is there any way to increase the amount of available memory, or reduce the amount of memory required for building the project?
Check Gitlab Forum:
Every runner only have 1CPU, 4GB RAM,
which means you don't have to adjust node options, it won't work.
For me, self-hosted is an option.
what ever I install gitlab-runner on self host, or docker, I got same issue.
Finally I got the root cause. The ec2 instance I created is too low, t2.micro
After I adjust it to t3.medium (you should be fine to adjust to any, with 4GB+ memory), it works without this issue any more.

Only execute script if branch is master in TravisCI

I'm new to TravisCI and this may be a very silly question, but I'm trying to write the travis config in a way that it only deploys to Firebase when the current branch is master.
That is, only when code is pushed to master or when a PR is merged with master, the firebase deploy command executes. The deploy command should be not be executed when other branches are pushed to, or when PRs are made.
Here's what I have so far:
language: node_js
node_js: 12.16.1
script: echo "Running travis-ci"
install:
- npm install -g firebase-tools
- npm i react-scripts
script:
- yarn add react
- yarn test
- if [ "$TRAVIS_BRANCH" = "master" ]; then yarn build; fi
- if [ "$TRAVIS_BRANCH" = "master" ]; then firebase deploy --project testproj8876 --token $FIREBASE_TOKEN; fi
branches:
only:
- master
Since I'm not too familiar with the conventions yet, any improvements/suggestions would also be greatly appreciated.
Google Firebase is supported directly by Travis. See here.
Thereby, I recommend using the solution described in the link above.
deploy:
provider: firebase
token:
secure: "YOUR ENCRYPTED token"
As for your condition, you can check one of my .travis.yml file here and the documentation there (Conditional Deployments)
The following part is what you need:
deploy:
cleanup: false
on:
branch:
- master
If you still have questions, feel free to ask.

Fail to deploy node on Elastic Beanstalk : The command '/bin/sh -c npm install' returned a non-zero code: 1

I am using elastic beanstalk from AWS to deploy and host a react application using Docker.
The deployment fails mysteriously, even though I succeed building the Docker image on my local machine.
An inspection to the logs on the EC2 instance (using eb ssh) does not provide more explanation that this:
--------------------------------
/var/log/eb-commandprocessor.log
--------------------------------
Step 5/14 : COPY package.json /usr/src/app/package.json
---> Using cache
---> f06f2c9d6519
Step 6/14 : RUN npm install
---> Running in 9926fc11431f
The command '/bin/sh -c npm install' returned a non-zero code: 1
Failed to build Docker image aws_beanstalk/staging-app: 2c9d6519
I even tried to run the npm install command inside the last layer of the built container using
sudo docker commit 9926fc11431f test && docker run -it test bash
cd /path/to/wordir
npm install
But the return code is actually 0
Is there any other way this could fail and logs return me wrong errors ?
I'm writing this answer for any future people which come by this. If there is no NPM error message. The issue is memory exhaustion there are two ways to resolve this on Beanstalk specifically:
Use a machine with more memory (instead of say a t2.micro)
(recommended) Switch to yarn. Yarn uses much less memory than npm.
Figure out some other way to reduce your memory footprint
This issue gave me a lot of headache so I hope this helps future folks who come across this issue.

Resources