I'm trying to build and run, but it says that "ng not found" and finally, that the container exited with code 127. Well, running npm install and then ng serve --open is sufficient for run my application outside a docker container, but inside it, simple doesn't works. I tried do RUN node_modules/.bin/ng build --prod, but .bin folder isn't there (what I think that is the problem, but I really don't know how to solve it, because even .dockerignore is not ignoring .bin). So, what should I do?
Dockerfile:
FROM node:lts-alpine
ENV NODE_ENV=production
WORKDIR /usr/src/app
COPY ["package.json", "package-lock.json*", "npm-shrinkwrap.json*", "./"]
RUN npm install --production --silent
COPY . .
RUN ls node_modules
EXPOSE 3000
USER node
CMD ["npm", "start"]
I also tried to `npm install #angular/cli -g', but I get into another error...
Related
Environments files are in git ignore just because of confidential info so I need create those angular environments file while building docker image.
I am getting the below error while running the docker build.
an unhandled exception occurred: The /usr/src/app/ng/src/environments/environment.prod.ts path in file replacements does not exist.
Docker file
FROM node:16 AS ng-build
WORKDIR /usr/src/app
COPY frontend/ ./frontend/
RUN cd frontend && npm install --legacy-peer-deps && npm run build --aot --output-hashing=none
FROM node:16 AS node
WORKDIR /usr/src/app
COPY backend/ ./backend/
COPY --from=ng-build /usr/src/app/frontend/dist/ ./backend/public
RUN cd backend && npm ci --only=production --omit=dev && npm cache clean --force
COPY backend/server.js ./backend/
EXPOSE 3000
CMD ["node", "./backend/server.js"]
Please suggest to me the right way to achieve it.
Here is my Dockerfile :
build front end
FROM node:v12.22.12 AS client_build
WORKDIR /client
COPY ./front/video /client/
RUN npm install
RUN node_modules/.bin/ng build --configuration production
build back end
FROM node:v12.22.12 AS server_build
WORKDIR /app
COPY ./front/videoService /app/server
COPY --from=client_build /client/dist/video /app/dist/video
RUN npm install --production
RUN tsc
EXPOSE 7717
CMD ["node", "./app/server/dist/front/videoService/src/index.js"]
build UI
FROM node:v12.22.12 AS ui_build
WORKDIR /ui
COPY ./front/UIVideo /ui/
RUN npm install
CMD ["node", "./ui/front/UIVideo/www.js"]
EXPOSE 7708
The ERROR I got : manifest for node:v12.22.12 not found: manifest unknown: manifest unknown
I dont know what is the source of the problem and failed to found a solution here on other discussions.
My Angular app runs fine locally but I haven't figured out how to do the same with a Docker image. Outside of Docker, the UI runs on port 4200 with ng serve and the API serves data from 8080 with node server.js.
My Dockerfile is set up so it can get the Node server running and available on 8080, but the Angular UI won't run. I've tried several options but right now I have:
FROM node:14.17.3
COPY package*.json ./
EXPOSE 4200 8080
RUN npm install -g #angular/cli
RUN npm install --only=production
COPY . ./
RUN ng serve
CMD ["node", "server.js"]
It fails on ng serve with the error: The serve command requires to be run in an Angular project, but a project definition could not be found. I do have an angular.json file in the root. I'm not sure what I am missing. I read that ng serve shouldn't be used in this situation but the alternatives I've seen haven't made a difference.
Workspace:
EDIT 8/10/21: Based on the answers here and a bunch of research, this will display the UI with nginx:
FROM node:12.16.1-alpine as build
WORKDIR /usr/src/app
COPY package*.json ./
RUN npm ci --only=production
COPY . .
# RUN npm install -g #angular/cli
# RUN npm run build --prod
FROM nginx:1.15.8-alpine
COPY --from=build /usr/src/app/dist /usr/share/nginx/html
# CMD ["node", "server.js"]
However, the npm run build step fails because ng is not found despite installing #angular/cli. I have to run this manually to build the dist folder. And I can't run node server.js alongside this. It seems I can only get the front end or back end, not both.
Use below command at the end to run ng serve with host 0.0.0.0 which means it listens to all interfaces.
CMD ["ng","serve","--host", "0.0.0.0"]
But I would suggest using ngInx.
Steps to follow:
Create a docker file under the root of your project, and add the below code. It takes care of: downloading dependencies, building angular project, and deploy it to ngInx server.
#Download Node Alpine image
FROM node:12.16.1-alpine As build
#Setup the working directory
WORKDIR /usr/src/ng-app
#Copy package.json
COPY package.json package-lock.json ./
#Install dependencies
RUN npm install
#Copy other files and folder to working directory
COPY . .
#Build Angular application in PROD mode
RUN npm run build
#Download NGINX Image
FROM nginx:1.15.8-alpine
#Copy built angular files to NGINX HTML folder
COPY --from=build /usr/src/ng-app/dist/pokemon-app/ /usr/share/nginx/html
Build docker image:
docker build -t my-ng-app .
Spinning the docker container with below command expose your app at port 80
docker run -dp 3000:80 my-ng-app
Check out my article on this - https://askudhay.com/how-to-dockerize-an-angular-application, and please let me know if you still have any questions.
I figured out a solution that will run the full application. Most answers here focus on running the front end (the nginx suggestion was helpful). It seemed a Docker container could enable the UI or server but not both. I came across Docker Compose, which will run the front and back ends in separate images. My solution:
Dockerfile.ui
# Define node version
FROM node:12.16.1-alpine as build
# Define container directory
WORKDIR /usr/src/app
# Copy package*.json for npm install
COPY package*.json ./
# Run npm clean install, including dev dependencies for #angular-devkit
RUN npm ci
# Run npm install #angular/cli
RUN npm install -g #angular/cli
# Copy all files
COPY . .
# Run ng build through npm to create dist folder
RUN npm run build --prod
# Define nginx for front-end server
FROM nginx:1.15.8-alpine
# Copy dist from ng build to nginx html folder
COPY --from=build /usr/src/app/dist /usr/share/nginx/html
Dockerfile.server
# Define node version
FROM node:12.16.1-alpine
# Define container directory
WORKDIR /usr/src/app
# Copy package*.json for npm install
COPY package*.json ./
# Run npm clean install, prod dependencies only
RUN npm ci --only=production
# Copy all files
COPY . .
# Expose port 8080 for server
EXPOSE 8080
# Run "node server/run.js"
CMD ["node", "server/run.js"]
docker-compose.yml
version: '3'
services:
server:
build:
context: ./
dockerfile: Dockerfile.server
container_name: server
ports:
- 8080:8080
ui:
build:
context: ./
dockerfile: Dockerfile.ui
container_name: ui
ports:
- 4200:80
links:
- server
docker-compose up will build out an image for server and UI and deploy concurrently. I also resolved the ng not found errors by installing dev dependencies, particularly #angular-devkit/build-angular.
This tutorial helped me figure out Docker Compose: https://wkrzywiec.medium.com/how-to-run-database-backend-and-frontend-in-a-single-click-with-docker-compose-4bcda66f6de
I think updating this line
COPY . ./
with
COPY . ./app
should solve that error. It appears that the node "volume" is in that folder.
Otherwise setting the workdir also seems like a solution:
FROM node:14
WORKDIR /usr/src/app
COPY package*.json ./
...
Source: https://nodejs.org/en/docs/guides/nodejs-docker-webapp/
I am Dockerizing Angular 9. When I run in development with ng serve it all works perfectly.
Also when I run the docker container on my locoed development environment (macOS), it works fine.
When I try build Angular in a docker container on a centos linux server, I get the following error:
ERROR in The Angular Compiler requires TypeScript >=3.6.4 and <3.9.0
but 3.9.7 was found instead.
Question
Anyone know how I can make the compile in docker use the right typescript version?
It's as if in docker, the compiler ignores the typscript version in the package.json.
More info:
package.json
"typescript": "^3.8.3"
Dockerfile
# stage 1
FROM node
WORKDIR /usr/src/app
COPY package.json package.json
RUN npm install --silent
COPY . .
RUN node_modules/.bin/ng build --prod --output-path=/dist
# stage 2
FROM nginx:alpine
WORKDIR /usr/src/app
RUN rm -rf /usr/share/nginx/html/*
COPY nginx.conf /etc/nginx/conf.d/default.conf
COPY --from=0 /dist /usr/share/nginx/html
CMD ["nginx", "-g", "daemon off;"]
Adding this to the Dockerfile solved the issue:
RUN npm i -D typescript#3.8.3
I have just started learning docker-compose and I am using a nodejs image. I want to install gulp to create some tasks and have one of them working on the background.
When I run: docker-compose run --rm -d server gulp watch-less
I get this error: ERROR: oci runtime error: container_linux.go:247: starting container process caused "exec: \"gulp\": executable file not found in $PATH"
Here are my file:
# Dockerfile
FROM node:6.10.2
RUN mkdir -p /usr/src/app
WORKDIR /usr/src/app
COPY package.json /usr/src/app
RUN npm install --quiet
COPY . /usr/src/app
CMD ["npm", "start"]
# docker-compose.yml
version: "2"
services:
server:
build: .
ports:
- "5000:5000"
volumes:
- ./:/usr/src/app
I also have a .dockerignore to ignore the node_modules folder and the npm-debug.log
EDIT:
When I run docker-compose run --rm server npm install package-name I don't have any problem and the package is installed.
Try adding gulp install in Dockerfile:
# Dockerfile
FROM node:6.10.2
RUN mkdir -p /usr/src/app
WORKDIR /usr/src/app
RUN npm install -g gulp
COPY package.json /usr/src/app
RUN npm install --quiet
COPY . /usr/src/app
CMD ["npm", "start"]
I have found a solution that works but maybe is not the best solution. I have created an script that runs a gulp task on the package.json and if I run:
docker-compose run --rm server npm run gulp_task it works and does what it has to do.
I find that just referencing gulp via
./node_modules/.bin/gulp
instead of directly works fine. ./node_modules/.bin isn't in the path by default. Another option would be to add that dir to the PATH.