npm update check failed for Docker container - docker

I have a React app running in a docker container with a following .Dockerfile.
FROM node:13.12.0-alpine
WORKDIR /app
ENV PATH /app/node_modules/.bin:$PATH
COPY /mvp-client-app ./
RUN npm install --silent
CMD ["npm", "start"]
When I start the container I see the following error message
> mvp-client-app#0.1.0 start /app
> react-scripts start
Attempting to bind to HOST environment variable: 0.0.0.0
If this was unintentional, check that you haven't mistakenly set it in your shell.
Learn more here:
ℹ 「wds」: Project is running at http://172.18.0.4/
ℹ 「wds」: webpack output is served from
ℹ 「wds」: Content not from webpack is served from /app/public
ℹ 「wds」: 404s will fallback to /
Starting the development server...
┌──────────────────────────────────────────────┐
│ npm update check failed │
│ Try running with sudo or get access │
│ to the local update config store via │
│ sudo chown -R $USER:$(id -gn $USER) /.config │
└──────────────────────────────────────────────┘
I was not able to add to the proposed command to the Dockerfile. How can I get rid of the message and start the container?
We are using docker-compose
version: '3.3'
services:
mvp-client:
container_name: mvp-client
build:
context: ./MVP
dockerfile: mvp-client-app/Dockerfile
ports:
- '3001:3001'
environment:
- REACT_APP_ENV=development
- COMPOSE_CONVERT_WINDOWS_PATHS=1
- HOST=0.0.0.0
- PORT=3001
user:
999:999
I try to run the container by docker-compose -f docker-compose.yml build mvp-client and docker-compose -f docker-compose.yml up mvp-client (intentionally running only the one container as others work fine). I use Ubuntu 18.04 LTS and Gitlab CI/CD pipeline.
Here is the package.json
{
"name": "mvp-client-app",
"version": "0.1.0",
"private": true,
"dependencies": {
"#blueprintjs/core": "^3.31.0",
"#blueprintjs/icons": "^3.20.1",
"#storybook/node-logger": "^6.0.3",
"#testing-library/jest-dom": "^5.11.3",
"#testing-library/react": "^10.4.8",
"#testing-library/user-event": "^12.1.1",
"axios": "^0.19.2",
"debug": "^4.1.1",
"echarts": "^4.7.0",
"echarts-for-react": "^2.0.15-beta.1",
"immer": "^7.0.7",
"lodash": "^4.17.15",
"node-gyp": "^7.1.0",
"react": "^16.13.0",
"react-dom": "^16.13.0",
"react-ga": "^3.1.2",
"react-google-recaptcha": "^2.1.0",
"react-lines-ellipsis": "^0.14.1",
"react-mosaic-component": "^4.1.1",
"react-notifications": "^1.6.0",
"react-redux": "^7.2.1",
"react-scripts": "^3.4.2",
"react-spinners": "^0.9.0",
"rebuild": "^0.1.2",
"redux": "^4.0.5",
"redux-thunk": "^2.3.0",
"socket.io-client": "^2.3.0",
"styled-components": "^5.1.1"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject",
"storybook": "start-storybook -p 9009 -s public",
"build-storybook": "build-storybook -s public"
},
"eslintConfig": {
"extends": "react-app"
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
},
"devDependencies": {
"#storybook/addon-actions": "^6.0.3",
"#storybook/addon-docs": "^6.0.3",
"#storybook/addon-knobs": "^6.0.3",
"#storybook/addon-links": "^6.0.3",
"#storybook/addon-storysource": "^6.0.3",
"#storybook/addons": "^6.0.3",
"#storybook/preset-create-react-app": "^3.1.4",
"#storybook/react": "^6.0.3"
}
}

I was solved by adding stdin_open: true to docker-compose.yml (see this question for further details).
version: '3.3'
services:
mvp-client:
container_name: mvp-client
build:
context: ./MVP
dockerfile: mvp-client-app/Dockerfile
ports:
- '3001:3001'
environment:
- REACT_APP_ENV=development
- COMPOSE_CONVERT_WINDOWS_PATHS=1
- HOST=0.0.0.0
- PORT=3001
user:
999:999
stdin_open: true

I wasn't using using docker-compose, so this solution did not work for me.
However, I got to the root cause, and this might help someone.
npm is looking for config in user's home, and with Docker scenario, there sometimes is no user and hence no home directory. Assigning
env HOME [same as WORKDIR]
in Dockerfile helped a lot.

Related

Im having a problem building docker for my nuxtjs app hot reload not working

Im having a problem building docker for my nuxtjs app
Im building a docker for develop my nuxt app but hot reload not working in container, shared volumes are working fine the only problem is the hot reload
my system is a windows using docker on a wsl
I added my dockerfile, docker compose and package.json files below
This is my Dockerfile
WORKDIR /usr/src/app
COPY . ./
RUN yarn install
EXPOSE 3000
ENV HOST=0.0.0.0
ENV PORT=3000
CMD [ "yarn", "dev" ]
and my docker-compose.yml
version: "3"
services:
aplication:
working_dir: /usr/src/app
build:
context: .
volumes:
- ./src/:/usr/src/app/src/
image: wetrack-nuxt
environment:
- CHOKIDAR_USEPOLLING=true
- NODE_ENV=development
ports:
- 3000:3000
This is my package.json
{
"name": "minton",
"version": "1.0.0",
"private": true,
"scripts": {
"dev": "nuxt",
"build": "nuxt build",
"start": "nuxt start",
"generate": "nuxt generate"
},
"dependencies": {
"#ckeditor/ckeditor5-build-classic": "^22.0.0",
"#ckeditor/ckeditor5-vue": "^1.0.2",
"#fullcalendar/bootstrap": "^5.3.0",
"#fullcalendar/core": "^5.3.0",
"#fullcalendar/interaction": "^5.3.0",
"#fullcalendar/list": "^5.3.0",
"#fullcalendar/timegrid": "^5.3.0",
"#fullcalendar/vue": "^5.3.0",
"#nuxtjs/axios": "^5.13.6",
"apexcharts": "^3.20.0",
"bootstrap": "^4.5.0",
"bootstrap-vue": "^2.15.0",
"c3": "^0.7.20",
"chart.js": "^2.9.3",
"chartist": "^0.11.4",
"firebase": "^7.19.1",
"nuxt": "^2.14.0",
"nuxt-i18n": "^6.15.0",
"simplebar-vue": "^2.0.0-beta.4",
"sweetalert2": "^9.17.1",
"v-click-outside": "^3.1.0",
"v-mask": "^2.2.3",
"vue-apexcharts": "^1.6.0",
"vue-c3": "^1.2.11",
"vue-chartist": "^2.3.1",
"vue-chartjs": "^3.5.1",
"vue-count-to": "^1.0.13",
"vue-draggable": "^2.0.6",
"vue-easy-lightbox": "^0.14.0",
"vue-form-wizard": "^0.8.4",
"vue-knob-control": "^1.6.0",
"vue-multiselect": "^2.1.6",
"vue-number-input-spinner": "^2.2.0",
"vue-quill-editor": "^3.0.6",
"vue-slide-bar": "^1.2.0",
"vue-string-filter": "^2.1.0",
"vue-switches": "^2.0.1",
"vue-tour": "^1.5.0",
"vue2-datepicker": "^3.6.2",
"vue2-dropzone": "^3.6.0",
"vue2-google-maps": "^0.10.7",
"vuelidate": "^0.7.5",
"vuex": "^3.5.1"
},
"devDependencies": {
"node-sass": "^4.14.1",
"sass-loader": "^10.0.1"
}
}
This is my docker-compose as an example, I just need to set volumes right and it worked
services:
nuxt-app:
build: .
container_name: nuxt-app
restart: unless-stopped
ports:
- '3333:3333'
environment:
- NUXT_PORT=3333
command: 'yarn dev'
volumes:
- ./:/app
networks:
- nuxt-network
networks:
nuxt-network:
driver: bridge
My Dockerfile:
FROM node:14.17.5
ENV NODE_ENV=development
WORKDIR /app
EXPOSE 3333
COPY package.json yarn.lock* ./
RUN yarn
ENV NUXT_HOST=0.0.0.0
ENV NUXT_PORT=3333
ENV PATH=./node_modules/.bin/:$PATH
COPY . .
CMD ["yarn", "dev"]
I solved my problmem removing
build: {
babel: {
compact: true
}
}
form my nuxt.config.js

Docker - Module not found: Can't resolve 'react-plotly.js'

This question is specific to my docker configuration.
Super new to Docker and hence this problem.
I tried all the possible solutions on the internet, but none of them worked.
Closest Question: React.js Docker - Module not found
Dockerization of React App
Below are my docker files
Dockerfile
FROM node:10
WORKDIR /app
# add `/app/node_modules/.bin` to $PATH
ENV PATH /app/node_modules/.bin:$PATH
# install dependencies
COPY package*.json ./
RUN npm install --silent
RUN npm install react-scripts -g --silent
COPY . .
EXPOSE 3000
CMD ["npm", "start"]
My system has node version 10.15.3
docker-compose.yml
version: '3'
services:
django:
build: ./api
command: ["python", "manage.py", "runserver", "0.0.0.0:8000"]
volumes:
- ./api:/app
ports:
- "8000:8000"
frontend:
build: ./frontend
volumes:
- ./frontend:/app
- /app/node_modules
ports:
- "3000:3000"
volumes:
node-modules:
Folder Structure:
api and frontend both have Dockerfile in it, but it's just the frontend Dockerfile that is causing the issue.
Cache messages
package.json
{
"name": "frontend",
"version": "0.1.0",
"private": true,
"dependencies": {
"#testing-library/jest-dom": "^5.11.5",
"#testing-library/react": "^11.1.0",
"#testing-library/user-event": "^12.1.10",
"moment": "^2.29.1",
"react": "^17.0.1",
"react-big-calendar": "^0.28.1",
"react-dom": "^17.0.1",
"react-router-dom": "^5.2.0",
"react-scripts": "4.0.0",
"web-vitals": "^0.2.4"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": [
"react-app",
"react-app/jest"
]
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
}
}
I faced the same issue but below steps helped me solve the issue.
While adding a new package to our React project and running it with docker-compose following these steps:
Stop any docker-composeif running, with docker-compose down -v
Now add your npm module in your react application, npm install react-plotly.js (in your case)
docker-compose up -d --build
After looking at your docker file it looks fine to me, so I think it's the way you're installing the package is causing the issue.

dockerFile copy: Forbidden path outside the build context:

I have the following folder structure:
- main/
.docker-compose.yml
- backend/
- micro-hr/
.dockerfile
- rabbitmq
i have my micro-hr folder where is my main package
and I have a local lib which is rabbitmq
this is my dockerfile:
FROM node:lts-alpine
#create app directory
#xx
WORKDIR /usr/src
RUN apk add --no-cache bash git
RUN touch /usr/src/.bashrc | echo "PS1='\w\$ '" >> /usr/src/.bashrc
#copy files
COPY ormconfig.ts .env package.json yarn.* ./
COPY ./rabbitmq/package.json /usr/src/rabbitmq/
#install modules lib modules
RUN cd /usr/src/api/ && npm install
#copy other files
COPY . /usr/src/api/
COPY ../rabbitmq /usr/src/rabbitmq/
#set work dir
USER node
docker-compose :
version: "3.7"
services:
micro-hr:
build: ./backend/micro-hr
entrypoint: ./.docker/entrypoint.sh
container_name: micro-hr
environment:
- CHOKIDAR_USEPOLLING=true
ports:
- 3001:3000
this is my package.json on my main package backend/micro-hr:
{
"name": "micro-hr",
"version": "1.0.0",
"main": "index.js",
"license": "MIT",
"scripts": {
"postinstall": "npm link ../rabbitmq/",
"postupdate": "npm link ../rabbitmq/",
"commit": "git-cz",
"build": "babel src --extensions \".js,.ts\" --out-dir dist --copy-files --no-copy-ignored",
"start:dev": "ts-node-dev --inspect --respawn --transpile-only --ignore-watch node_modules -r tsconfig-paths/register src/index.ts",
"start:debug": "node start --debug --watch",
"start:prod": "node dist/index.ts",
"test": "jest",
"lint": "eslint --fix",
"lint2": "eslint \"{src,apps,libs,test}/**/*.ts\" --fix",
"typeorm": "ts-node -r tsconfig-paths/register ./node_modules/typeorm/cli.js --config ./ormconfig.ts",
"migration:generate": "ts-node ./node_modules/typeorm/cli.js migration:generate -n"
},
"devDependencies": {
"#babel/cli": "^7.11.5",
"#babel/core": "^7.11.5",
"#babel/node": "^7.10.5",
"#babel/preset-env": "^7.11.5",
"#babel/preset-typescript": "^7.10.4",
"#commitlint/cli": "^9.1.2",
"#commitlint/config-conventional": "^9.1.2",
"#types/bcryptjs": "^2.4.2",
"#types/cookie-parser": "^1.4.2",
"#types/cors": "^2.8.7",
"#types/express": "^4.17.8",
"#types/helmet": "^0.0.48",
"#types/jest": "^26.0.13",
"#types/pino": "^6.3.0",
"#types/pino-http": "^5.0.5",
"#types/supertest": "^2.0.10",
"#typescript-eslint/eslint-plugin": "^4.0.1",
"#typescript-eslint/parser": "^4.0.1",
"babel-plugin-module-resolver": "^4.0.0",
"commitizen": "^4.2.1",
"cz-conventional-changelog": "^3.3.0",
"eslint": "^7.8.1",
"eslint-config-airbnb-base": "^14.2.0",
"eslint-config-prettier": "^6.11.0",
"eslint-config-standard": "^14.1.1",
"eslint-import-resolver-typescript": "^2.3.0",
"eslint-plugin-import": "^2.22.0",
"eslint-plugin-node": "^11.1.0",
"eslint-plugin-prettier": "^3.1.4",
"eslint-plugin-promise": "^4.2.1",
"eslint-plugin-standard": "^4.0.1",
"husky": "^4.2.5",
"jest": "^26.4.2",
"pino-pretty": "^4.2.0",
"prettier": "^2.1.1",
"supertest": "^4.0.2",
"ts-jest": "^26.3.0",
"ts-node": "^9.0.0",
"ts-node-dev": "^1.0.0-pre.62",
"tsconfig-paths": "^3.9.0",
"tscpaths": "^0.0.9",
"typescript": "^4.0.2"
},
"dependencies": {
"amqplib": "^0.6.0",
"assert": "^2.0.0",
"bcryptjs": "^2.4.3",
"class-transformer": "^0.3.1",
"cors": "^2.8.5",
"dotenv": "^8.2.0",
"envalid": "^6.0.2",
"express": "^4.17.1",
"extendable-error": "^0.1.7",
"helmet": "^4.1.0",
"pg": "^8.3.3",
"pino": "^6.5.1",
"pino-http": "^5.2.0",
"reflect-metadata": "^0.1.13",
"tsyringe": "^4.3.0",
"typeorm": "^0.2.25"
},
"config": {
"commitizen": {
"path": "cz-conventional-changelog"
}
}
}
I don't know where I am wrong, basically I made the link in my main package to my lib with the npm link
and tried to create the folders in the docker, but to no avail.
error on docker build:
Step 6/10 : COPY ../rabbitmq/package.json /usr/src/rabbitmq/ ERROR:
Service 'micro-hr' failed to build: COPY failed: Forbidden path
outside the build context: ../rabbitmq/package.json ()
This line in .dockerfile:
COPY ./rabbitmq/package.json /usr/src/rabbitmq/
tells Docker to find file package.json in folder rabbitmq in main directory of the build context and then copy it to the container as /usr/src/rabbitmq/
This line in .docker-compose.yml:
build: ./backend/micro-hr
sets the build context to directory backend/micro-hr relative to that file.
So if your file structure is:
main
|- .docker-compose.yml
|- backend/
|- micro-hr/
|-.dockerfile
|- rabbitmq
then your telling Docker to copy backend/micro-hr/rabbitmq/package.json, which does not exist. Furthermore your rabbitmq directory is not in the build context at all, sono matter what you put into the Dockerfile it will never be found.
So you should change your .docker-compose.yml to:
version: "3.7"
services:
micro-hr:
build:
context: .
dockerfile: backend/micro-hr/.dockerfile
entrypoint: ./.docker/entrypoint.sh
container_name: micro-hr
environment:
- CHOKIDAR_USEPOLLING=true
ports:
- 3001:3000
and your .dockerfile to (I think, you did not specify where all those files are in your project)
FROM node:lts-alpine
#create app directory
#xx
WORKDIR /usr/src
RUN apk add --no-cache bash git
RUN touch /usr/src/.bashrc | echo "PS1='\w\$ '" >> /usr/src/.bashrc
#copy files
COPY backend/micro-hr/ormconfig.ts backend/micro-hr/.env backend/micro-hr/package.json backend/micro-hr/yarn.* ./
COPY backend/rabbitmq/package.json /usr/src/rabbitmq/
#install modules lib modules
RUN cd /usr/src/api/ && npm install
#copy other files
COPY backend/micro-hr/ /usr/src/api/
COPY backend/rabbitmq /usr/src/rabbitmq
#set work dir
USER node
As a side note, this:
USER node
sets user, not working directory.
You need to provide the context in your docker-compose file :
version: "3.7"
services:
micro-hr:
context: . # here
build: ./backend/micro-hr
entrypoint: ./.docker/entrypoint.sh
container_name: micro-hr
environment:
- CHOKIDAR_USEPOLLING=true
ports:
- 3001:3000
You always need to provide the context.

How to make yarn start work inside Docker image with react-scripts 3.4 and babel-loader 8.1?

I'm building a Docker image for debugging of my React application with a separate Dockerfile
FROM node:11-alpine
COPY package.json .
COPY yarn.lock .
RUN yarn install
COPY public/ ./public/
COPY src/ ./src/
EXPOSE 3000
CMD yarn run start
with package.json
{
"name": "yarn-start-in-kubernetes",
"version": "0.1.0",
"private": true,
"dependencies": {
"react": "^16.8.1",
"react-dom": "^16.8.1",
"react-scripts": "2.1.3",
"babel-loader": "8.0.4"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"browserslist": [
">0.2%",
"not dead",
"not ie <= 11",
"not op_mini all"
]
}
which starts the development server as expected when the image is used with docker run. An upgrade to
"react-scripts": "2.1.3",
"babel-loader": "8.0.4"
causes the setup to be no longer usable because the development server terminates:
> docker run dev
yarn run v1.15.2
$ react-scripts start
ℹ 「wds」: Project is running at http://172.17.0.2/
ℹ 「wds」: webpack output is served from
ℹ 「wds」: Content not from webpack is served from /public
ℹ 「wds」: 404s will fallback to /
Starting the development server...
Done in 2.72s.
The docker run returns after Done in ....
I'd like to use the more up-to-date versions which work fine in production. How can I make them work in the debugging image?
The versions don't seem to affect the functioning of the development server outside Docker, i.e. yarn start works with both version combinations.
I was having the same issue and just added:
stdin_open: true
to my docker-compose.yml
Adding stdin_open: true or tty: true to the docker-compose file works:
services:
app:
tty: true
stdin_open: true # without this node doesn't start
stdin_open stands for standard input (interactive) and tty means terminal.
7e6d6cd Indicates a check for interactivity.
https://docs.docker.com/compose/reference/run/
If you are not using docker-compose you must use -it together in order to allocate a tty for the container process.
https://docs.docker.com/engine/reference/run/#foreground

npm ERR! in docker-compose

I'm new to docker and i'm trying to build containers from a docker-compose.yml file
version: '3.0'
volumes:
mongodb:
esdb:
driver: local
services:
app:
build: ./
command: npm run dev
container_name: beez-backend
networks:
- custom
volumes:
- ./:/beez-backend/
ports:
- "3030:3030"
- "9229:9229"
external_links:
- mongo
depends_on:
- mongo
env_file:
./dev.env
# MongoDB image config - this container will exposed as external so other container will use it
mongo:
image: mongo
container_name: beez-backend-mongo
ports:
- "27036:27017"
volumes:
- mongodb:/data/db
networks:
- custom
networks:
custom:
external: true
And my Dockerfile
FROM node:dubnium-alpine
LABEL maintainer="XXX"
RUN mkdir -p /beez-backend
RUN npm install nodemon -g
WORKDIR /beez-backend
COPY package.json /beez-backend
RUN npm install
COPY . /beez-backend
EXPOSE 3030
EXPOSE 9229
CMD ["npm","start"]
package.json dependencies -
{
"name": "XXX",
"description": "XXX",
"version": "0.0.0",
"homepage": "",
"main": "src",
"keywords": [
"feathers",
"beez"
],
"author": {
"name": "X",
"email": "X"
},
"contributors": [],
"bugs": {},
"directories": {
"lib": "src",
"test": "test/"
},
"engines": {
"node": "^11.0.0",
"npm": ">= 3.0.0"
},
"scripts": {
"test": "npm run eslint && NODE_ENV= npm run mocha",
"eslint": "eslint src/. test/. --config .eslintrc.json",
"dev": "nodemon -L --delay 2 --inspect=0.0.0.0:9229 src/",
"start": "node src/",
"mocha": "mocha test/ --recursive --exit"
},
"dependencies": {
"#feathersjs/authentication": "^4.5.2",
"#feathersjs/authentication-local": "^4.5.2",
"#feathersjs/authentication-oauth": "^4.5.2",
"#feathersjs/configuration": "^4.5.2",
"#feathersjs/errors": "^4.5.2",
"#feathersjs/express": "^4.5.2",
"#feathersjs/feathers": "^4.5.2",
"#feathersjs/socketio": "^4.5.2",
"axios": "^0.19.2",
"compression": "^1.7.4",
"cors": "^2.8.5",
"cron": "^1.7.2",
"exceljs": "^3.8.1",
"feathers-authentication-hooks": "^1.0.0",
"feathers-authentication-management": "^2.0.1",
"feathers-hooks-common": "^4.20.7",
"feathers-mailer": "^3.0.1",
"feathers-mongoose": "^8.1.0",
"feathers-populate-hook": "^0.5.3",
"feathers-swagger": "^1.1.1",
"firebase-admin": "^8.6.0",
"form-data": "^2.5.1",
"helmet": "^3.21.3",
"lodash": "^4.17.15",
"moment": "^2.24.0",
"mongodb-core": "^3.2.7",
"mongoosastic": "^4.5.1",
"mongoose": "^5.9.3",
"multer": "^1.4.2",
"multer-google-storage": "^1.3.0",
"nodemailer-sendgrid": "^1.0.3",
"nodemailer-sendgrid-transport": "^0.2.0",
"nodemailer-smtp-transport": "^2.7.4",
"npm": "^6.14.2",
"pug": "^2.0.4",
"serve-favicon": "^2.5.0",
"validator": "^11.1.0",
"winston": "^3.2.1"
},
"devDependencies": {
"eslint": "^6.5.1",
"mocha": "^6.2.1",
"nodemon": "^1.19.4",
"request": "^2.88.2",
"request-promise": "^4.2.5"
}
}
It goes through the steps properly until step 7/11 which is RUN npm install. Here is gives the error:
npm ERR! Unexpected end of JSON input while parsing near /..UyIRBcPKVK9LxycWnlezO'
npm ERR! A complete log of this run can be found in:
npm ERR! /root/.npm/_logs/2020-05-21T17_48_59_909Z-debug.log
ERROR: Service 'app' failed to build:
The command '/bin/sh -c npm install' returned a non-zero code: 1
I tried the npm cache clean --force and running docker-compose up but it didn't change. I also tried adding the line RUN npm cache clean right before the RUN npm install in the Dockerfile but it still didn't work. Both the Dockerfile and docker-compose.yml file are on the same directory.
Try below steps :
$ npm cache clean --force
or
$ npm cache verify
$ npm install -g #angular/cli#latest
$ npm install --save-dev #angular/cli#latest
Delete node_modules
Run $ npm install

Resources