The issue:
When running skaffold and update watched files, I see the file sync update occur and nodemon restart the server, but refreshing the page doesn't show the change. It's not until after I stop skaffold entirely and restart that I see the change.
Syncing 1 files for test/dev-client:e9c0a112af09abedcb441j4asdfasfd1cf80f2a9bc80342fd4123f01f32e234cfc18
Watching for changes every 1s...
[client-deployment-656asdf881-m643v client] [nodemon] restarting due to changes...
[client-deployment-656asdf881-m643v client] [nodemon] starting `node bin/server.js`
The setup:
I have a simple microservices application. It has a server side (flask/python) and a client side (react) with express handling the dev server. I have nodemon on with the legacy watch flag as true (For Chokidar polling). On development I'm using Kubernetes via Docker for Mac.
Code:
I'm happy to post my code to assist. Just let me know which ones are most needed.
Here's some starters:
Skaffold.yaml:
apiVersion: skaffold/v1beta7
kind: Config
build:
local:
push: false
artifacts:
- image: test/dev-client
docker:
dockerfile: Dockerfile.dev
context: ./client
sync:
'**/*.css': .
'**/*.scss': .
'**/*.js': .
- image: test/dev-server
docker:
dockerfile: Dockerfile.dev
context: ./server
sync:
'**/*.py': .
deploy:
kubectl:
manifests:
- k8s-test/client-ip-service.yaml
- k8s-test/client-deployment.yaml
- k8s-test/ingress-service.yaml
- k8s-test/server-cluster-ip-service.yaml
- k8s-test/server-deployment.yaml
The relevant part from Package.json:
"start": "nodemon -L bin/server.js",
Dockerfile.dev (Client side):
# base image
FROM node:10.8.0-alpine
# setting the working directory
# may have to run this depending on environment
# RUN mkdir -p /usr/src/app
WORKDIR /usr/src/app
# add '/usr/src/app/node_modules/.bin' to $PATH
ENV PATH /usr/src/app/node_modules/.bin:$PATH
# install and cache app depencies
COPY package.json /usr/src/app/package.json
RUN npm install
# copy over everything else
COPY . .
# start the app.
CMD ["npm", "run", "start"]
It turns out I was using the wrong pattern for my file syncs. **/*.js doesn't sync the directory properly.
After changing
sync:
'**/*.css': .
'**/*.scss': .
'**/*.js': .
to
sync:
'***/*.css': .
'***/*.scss': .
'***/*.js': .
It immediately began working.
Update:
On the latest versions of skaffold, this pattern no longer works as skaffold abandoned flattening by default. You can now use **/* patterns and get the same results.
Related
I was dockerising an app of mine but I wanted to access it on port 80 on my machine, every time a change the port in docker-composer.yml it returnes the error:
ERROR: for site Cannot create container for service site: mount denied:
the source path "dcfffb89fd376c0d955b0903e3aae045df32a073a6743c7e44b3214325700576:D:\\projetos\\portfolio\\site\\node_modules:rw"
too many colons
ERROR: Encountered errors while bringing up the project.
Im running on windows
docker-composer.yml
version: '3.7'
services:
site:
container_name: site
build: ./site
volumes:
- 'D:\projetos\portfolio\site'
- 'D:\projetos\portfolio\site\node_modules'
ports:
- 3000:3000
stdin_open: true
environment:
- CHOKIDAR_USEPOLLING=true
- COMPOSE_CONVERT_WINDOWS_PATHS=true
command: npm start
Dockerfile
FROM node:16.13.1-alpine
WORKDIR /usr/src/app
COPY package*.json ./
RUN npm install
COPY . .
EXPOSE 3000
CMD [ "npm", "start" ]
I was using the wrong path pattern, on windows you have to use /c/path/to/volume since the ":" is used inside docker stuff(don't know what), also removed the command COMPOSE_CONVERT_WINDOWS_PATHS=true and worked just fine.
I have a dummy react app deployed from Dockerfile.dev:
FROM node:alpine AS builder
WORKDIR '/app'
COPY package.json .
RUN npm install
COPY . .
RUN npm run build
FROM nginx
EXPOSE 80
COPY --from=builder /app/build /usr/share/nginx/html
which is deployed to elasticbeanstalk right after it is pushed to GitHub using TravisCI:
sudo: required
services:
- docker
before_install:
- docker build -t name/docker-react -f Dockerfile.dev .
script:
- docker run -e CI=true name/docker-react npm run test
deploy:
provider: elasticbeanstalk
region: 'us-east-1'
app: 'docker'
env: 'Docker-env'
bucket_name: 'elasticbeanstalk-us-east-1-709516719664'
bucket_path: 'docker'
on:
branch: main
access_key_id: $AWS_ACCESS_KEY
secret_access_key: $AWS_SECRET_KEY
The app is successfully deploying to EB but displays 502 Bad Gateway as soon as I access it (by clicking the app link in AWS EB). Enhanced health overview reports:
Process default has been unhealthy for 18 hours (Target.FailedHealthChecks).
Docker-env EC2 instance is running and after allowing all incoming connections to it I can connect just fine:
I can build my app using Dockerfile.dev locally with no problems:
docker build -t name/docker-react -f Dockerfile.dev .
=> => naming to docker.io/name/docker-react
docker run -p 3000:3000 name/docker-react
AWS has a hard time with the '.' folder designation and prefers the long form ./
Try to edit the COPY instruction to COPY package*.json ./
And try also to remove the named builder. By default, the stages are not named, and you refer to them by their integer number, starting with 0 for the first FROM instruction.
Your Dockerfile should looks like:
FROM node:alpine
WORKDIR '/app'
COPY package*.json ./
RUN npm install
COPY . .
RUN npm run build
FROM nginx
EXPOSE 80
COPY --from=0 /app/build /usr/share/nginx/html
You should have a docker-compose.yml, just ensure that you have the right port mapping inside:
Example:
services:
web-service:
build:
context: .
dockerfile: Dockerfile.dev
ports:
- "80:3000" # outside:inside container
finally your TravisCI configuration must be edited. secret_acces_key has ONE 'S'
...
access_key_id: $AWS_ACCESS_KEY
secret_acces_key: $AWS_SECRET_KEY
Nginx default port is 80, and AWS only checks docker-compose.yml to manage resources efficiently, just do the right port mapping inside that file
version: '3'
services:
web:
build:
context: .
dockerfile: Dockerfile.dev
ports:
- "80:3000"
volumes:
- /app/node_modules
- .:/app
Environment health has transitioned from Ok to Severe. ELB processes are not healthy on all instances. ELB health is failing or not available for all instances.
I am deploying a react app in AWS using the docker platform. I am getting HEALTH-Severe issues when I deploy my app. I have also added custom TCP inbound rules in the EC2 instance (source-anywhere).
I am using free tier in AWS. The following is my Dockerfile.
FROM node:alpine as builder
WORKDIR '/app'
COPY package*.json ./
RUN npm install
COPY . .
RUN npm run build
FROM nginx
EXPOSE 80
COPY --from=builder /app/build /usr/share/nginx/html
My .travis.yml file:
language: generic
sudo: required
services:
- docker
before_install:
- docker build -t username/docker-react -f Dockerfile.dev .
script:
- docker run -e CI=true username/docker-react npm run test
deploy:
provider: elasticbeanstalk
region: us-east-2
app: "docker-react"
env: "DockerReact-env"
bucket_name: "my bucket-name"
bucket_path: "docker-react"
on:
branch: master
access_key_id: $AWS_ACCESS_KEY
secret_access_key: $AWS_SECRET_KEY
When I open my app I am getting 502 Bad Gateway error.
I had the same problem. After reading some of the documentation here I figured maybe docker-compose.yml is actually picked up first before anything. Deleting my docker-compose.yml (which I was only using locally) solved the issue for me.
After a week or so of reading Ive been experimenting with docker compose.
I have a docker compose file:
version: "3.8"
x-common-variables: &common-variables
MYSQL_USER: root
MYSQL_PASSWORD: MyPassWord
MYSQL_DATABASE: wedding
MYSQL_HOST_IP: 127.0.0.1
REACT_APP_SERVER_PORT: 4000
services:
mysql:
image: mysql:latest
environment:
<<: *common-variables
MYSQL_HOST: localhost
MYSQL_ROOT_PASSWORD: root
ports:
- 3307:3307
restart: unless-stopped
volumes:
- /wedding_Script2.sql:/docker-entrypoint-initdb.d/wedding_Script2.sql
phpmyadmin:
depends_on:
- mysql
image: phpmyadmin/phpmyadmin
environment:
PMA_HOST: mysql
links:
- mysql:mysql
ports:
- 8080:80
restart: always
server:
build: ./weddingApp-Be
depends_on:
- mysql
expose:
- 4000
environment:
<<: *common-variables
MYSQL_HOST_IP: mysql
NODE_PATH: src
ports:
- 4000:4000
volumes:
- ./weddingApp-Be/src:/server
links:
- mysql
command: npm run dev
client:
build: ./weddingApp-Fe
image: nginx:alpine
environment:
<<: *common-variables
NODE_PATH: src
expose:
- 3000
ports:
- 3000:3000
volumes:
- ./weddingApp-Fe/src:/index
links:
- server
command: nginx, -g, daemon off
My project structure:
inside of weddingApp-Fe my dockerFile:
FROM node:12.2.0-alpine as build
WORKDIR /app
ENV PATH /app/node_modules/.bin:$PATH
COPY package.json /app/package.json
RUN npm install --silent
RUN npm install react-scripts#3.0.1 -g --silent
COPY . /app
RUN npm run build
# production environment
FROM nginx:1.16.0-alpine
COPY --from=build /app/build /usr/share/nginx/html
EXPOSE 3000
CMD ["nginx", "-g", "daemon off;"]
When i do docker compose build:
mysql uses an image, skipping
phpmyadmin uses an image, skipping
Building server
Step 1/8 : FROM node:10-alpine
---> 8e473595b853
Step 2/8 : RUN mkdir -p /app
---> Using cache
---> 19b56a37f612
Step 3/8 : WORKDIR /app
---> Using cache
---> 8dce08d04982
Step 4/8 : COPY package.json /app
---> Using cache
---> e5efea9d7cd2
Step 5/8 : COPY yarn.lock /app
---> Using cache
---> 94ed16d1b60f
Step 6/8 : COPY . /app
---> Using cache
---> 57942181ca20
Step 7/8 : RUN npm install
---> Using cache
---> cc6cf02a698f
Step 8/8 : CMD ["npm", "run dev"]
---> Using cache
---> 043145db7a94
Successfully built 043145db7a94
Successfully tagged weddingapp_server:latest
Building client
Step 1/12 : FROM node:12.2.0-alpine as build
---> f391dabf9dce
Step 2/12 : WORKDIR /app
---> Using cache
---> 33e6357adf78
Step 3/12 : ENV PATH /app/node_modules/.bin:$PATH
---> Using cache
---> 90bef54edec6
Step 4/12 : COPY package.json /app/package.json
---> Using cache
---> 92f7b7643519
Step 5/12 : RUN npm install --silent
---> Using cache
---> 912d5018ac08
Step 6/12 : RUN npm install react-scripts#3.0.1 -g --silent
---> Using cache
---> bec736fe9b8f
Step 7/12 : COPY . /app
---> Using cache
---> 29232568be7d
Step 8/12 : RUN npm run build
---> Using cache
---> 59219cc1e335
Step 9/12 : FROM nginx:1.16.0-alpine
---> ef04b00b089d
Step 10/12 : COPY --from=build /app/build /usr/share/nginx/html
---> Using cache
---> a5be9b459a1b
Step 11/12 : EXPOSE 3000
---> Using cache
---> 684c6b70aed5
Step 12/12 : CMD ["nginx", "-g", "daemon off;"]
---> Using cache
---> c38b886354d6
Successfully built c38b886354d6
Successfully tagged nginx:alpine
Problem:
After this I do docker compose up
and thats when I get the following error:
Removing weddingapp_client_1
weddingapp_mysql_1 is up-to-date
weddingapp_phpmyadmin_1 is up-to-date
weddingapp_server_1 is up-to-date
Recreating 5b9004354493_weddingapp_client_1 ... error
ERROR: for 5b9004354493_weddingapp_client_1 Cannot start service client: OCI runtime create failed: container_linux.go:349: starting container process caused "exec: \"nginx,\": executable file not found in $PATH": unknown
ERROR: for client Cannot start service client: OCI runtime create failed: container_linux.go:349: starting container process caused "exec: \"nginx,\": executable file not found in $PATH": unknown
Encountered errors while bringing up the project.
I figure its a problem with my nginx but I dont know what.
EDIT:
If i would change to npm start
at the bottom of the docker-compose then I get
ERROR: for weddingapp_client_1 Cannot start service client: OCI
runtime create failed: container_linux.go:349: starting container
process caused "exec: "npm": executable file not found in $PATH":
unknown
ERROR: for client Cannot start service client: OCI runtime create
failed: container_linux.go:349: starting container process caused
"exec: "npm": executable file not found in $PATH": unknown
You're telling Compose to override the command with something that doesn't make sense:
command: nginx, -g, daemon off
This has the same effect as running that command at the command line: the comma is interpreted as part of the command.
You don't actually need this option, since the Dockerfile has
CMD ["nginx", "-g", "daemon off;"]
which is what you want it to do.
You can similarly delete expose: and links: (not useful in present-day Docker networking) and volumes: (because the code is already in your image). If you are build: your own image, you do not also want image: naming a public Docker Hub image (your locally-built image will overwrite that one and you'll have confusing results), and the database address is probably not 127.0.0.1 ("this container"). You can probably successfully trim that part of the docker-compose.yml file down to
client:
build: ./weddingApp-Fe
environment:
MYSQL_USER: root
MYSQL_PASSWORD: MyPassWord
MYSQL_DATABASE: wedding
MYSQL_HOST_IP: mysql
ports:
- 3000:3000
(If you really wanted to override the command in the Dockerfile, YAML list syntax command: [nginx, -g, 'daemon off;'] is what you'd need here, but using the default command from the Dockerfile is better.)
The Dockerfile for your client app is specifying node:12.2.0-alpine as the base image which does not include nginx. You will need to install NGINX in this image in order for it to work. Even though you have nginx:alpine as the specified image in your docker-compose file, you have pointed docker-compose build context to ./weddingApp-Fe. This means that docker-compose will search for a Dockerfile in that directory and use it to build your image. NGINX not being installed is also the reason it doesn't crash when you remove the command: nginx, -g, daemon off line from the compose file.
I am trying to use docker for MERN project. I have created Dockerfile in both client and server, and docker-compose.yml in root folder.
I executed code docker-compose build. It executed without any error. Then I run docker-compose up, node and mongodb run successfully but react js is exited with code 0.
Dockerfile for client
# build environment
FROM node:12.18.2-alpine
RUN mkdir -p /opt/app/ps-client
WORKDIR /opt/app/ps-client
# install app dependencies
COPY package.json .
# COPY package-lock.json .
RUN npm install
COPY . .
EXPOSE 3000
CMD [ "npm", "run", "start"]
docker-compose.yml
version: "3.8" # specify docker-compose version
# Define the services/ containers to be run
services:
back-end: # name of the first service
build: server # specify the directory of the Dockerfile
ports:
- "5000:5000" #specify ports mapping
links:
- database # link this service to the database service
database: # name of the third service
image: mongo # specify image to build container from
ports:
- "27017:27017" # specify port forwarding
front-end: # name of the second service
build: client # specify the directory of the Dockerfile
ports:
- "3000:3000" # specify port mapping
I tried docker-compose --verbose up only for react js, result
docker container inspect b9e429 result of this command is result
Try adding the following options to the front-end service configuration in the docker compose file.
stdin_open: true
tty: true
This should be equivalent to running the container with the -it options.
You can read more about the issue here: https://github.com/facebook/create-react-app/issues/8688
Add tty: true to your front-end service should suffice. The full context of the issue is described at: https://github.com/facebook/create-react-app/issues/8688 as mentioned by Teddy Sterne