Svelte app showing blank page in Docker container on local machine - docker

I'm trying to containerise a Svelte App, it runs fine outside the container, however, after I build and run the Docker container I see a blank page, I do see the title of the app the page though is totally blank.
This is my Dockerfile:
FROM node:15.4 as build
WORKDIR /app
COPY package*.json .
RUN npm install
COPY . .
EXPOSE 5000
CMD [ "npm", "start" ]
Any ideas on what I'm doing wrong?
Thanks!

This should work
FROM node:15.4 as build
WORKDIR /app
COPY package*.json ./
RUN npm install
COPY . ./
RUN npm run build
EXPOSE 5000
CMD [ "npm", "start" ]

Related

Docker + Sveltekit, cant access localhost:3000

After building I start the image and see in the terminal:
*Executing task: docker run --rm -it -p 3000:3000/tcp bamdock:latest
Listening on 0.0.0.0:3000*
However when trying to reach http://localhost:3000/ in browser I see:
*The connection was reset*
*The connection to the server was reset while the page was loading.
The site could be temporarily unavailable or too busy. Try again in a few moments.
If you are unable to load any pages, check your computer’s network connection.
If your computer or network is protected by a firewall or proxy, make sure that Firefox is permitted to access the web.*
This is my Dockerfile:
FROM node:19 as builder
RUN npm install -g pnpm
WORKDIR /usr/src/app
COPY package*.json ./
RUN pnpm install
COPY prisma ./prisma/
COPY .env ./
RUN npx prisma generate
COPY . .
RUN pnpm run build
FROM node:19-alpine3.16
WORKDIR /app
COPY --from=builder /usr/src/app/build .
COPY --from=builder /usr/src/app/package.json .
COPY --from=builder /usr/src/app/node_modules ./node_modules
EXPOSE 3000
CMD ["node", "index.js"]
Any ideas what I'm missing?
My first time trying to get Docker working ...

Solving the error of "docker build" not accesing package.json

I am trying to build an image for an express app and I have issues running the command. The error indicates that the package.json file is not accessible. Please look at the structure error below.
Sending build context to Docker daemon 2.048kB
Step 1/7 : FROM node:8-alpine
---> 2b8fcdc6230a
Step 2/7 : WORKDIR /usr/src/app
---> Using cache
---> d0f2d783ba5a
Step 3/7 : COPY package*.json ./
COPY failed: no source files were specified
Also, the docker file is shown below:
FROM node:8-alpine
WORKDIR /usr/src/app
COPY package*.json ./
RUN npm install
COPY . .
EXPOSE 3000
CMD [ "npm", "start" ]
Then lastly the file structure is shown below:
I'd like any assistance possible. Thanks.
Use the command docker build . and it will run perfectly.
This could be due to the Node.JS version you are trying to use in the docker file, i'm not entirely sure if this is the case but I have used this docker file with my node.js express application and it seemed to work. Give it a shot.
FROM node:12
WORKDIR /usr/src/app
COPY package*.json ./
RUN npm install
COPY . .
EXPOSE 3000
CMD ["npm", "start"]
Use COPY ./package*.json ./ like this in dockerfile.

Can't get nodemon to work within a docker container

OK, I ran out of ideas now. I am trying to get nodemon to work in a dockerized (Docker Toolbox, Win 8.1) simple nodejs app.
file structure
Dockerfile
FROM node:latest
USER root
RUN mkdir -p /usr/src/app
WORKDIR /usr/src/app
COPY package*.json ./
RUN npm install
RUN npm install -g nodemon
COPY . .
EXPOSE 3000
CMD [ "npm", "run", "devStart" ]
script
"devStart": "nodemon --ext ejs,js,json,css --watch server --watch views server/server.js",
-it output
Everything seems to match, but when I edit a partial/view nodemon does not restart.
Tried with nodemon as production (ie. not dev) dependency and then npx nodemon... - wouldn't work either.

Why webpack bundle is successfully built and run without multi-stage docker build?

I have the following Dockerfile:
FROM node:12.4.0 as builder
COPY ./package.json /src/package.json
ENV PORT 3000
WORKDIR /src
RUN npm install
COPY ./lerna.json /src/lerna.json
COPY ./packages/package-api/package.json /src/packages/package-api/package.json
COPY ./packages/package-config/package.json /src/packages/package-config/package.json
COPY ./packages/package-sitemap/package.json /src/packages/package-sitemap/package.json
COPY ./packages/package-utils/package.json /src/packages/package-utils/package.json
RUN npm run clean
COPY . /src
WORKDIR /src/packages/package-sitemap
RUN npm run build
FROM node:12.4.0
RUN echo "starting 2nd stage"
WORKDIR /src/packages/package-sitemap
COPY --from=builder /src/packages/package-sitemap/build/bundle.js .
EXPOSE ${PORT}
CMD ["node" , "bundle.js"]
running the bundle built from such Dockerfile results in following error: Error: Cannot find module 'debug'.
However if I remove the second stage and build the bundle in one stage there's no error and the bundle runs successfully, that is with the following Dockerfile:
FROM node:12.4.0 as builder
COPY ./package.json /src/package.json
ENV PORT 3000
WORKDIR /src
RUN npm install
COPY ./lerna.json /src/lerna.json
COPY ./packages/package-api/package.json /src/packages/package-api/package.json
COPY ./packages/package-config/package.json /src/packages/package-config/package.json
COPY ./packages/package-sitemap/package.json /src/packages/package-sitemap/package.json
COPY ./packages/package-utils/package.json /src/packages/package-utils/package.json
RUN npm run clean
COPY . /src
WORKDIR /src/packages/leaf-sitemap
RUN npm run build
EXPOSE ${PORT}
CMD ["node" , "build/bundle.js"]
I'm wondering what the difference can be? Is it because in the 2nd Dockerfile node_modules exist as well and webpack somehow sets paths to some modules in the bundle to the node_modules?

Docker ExpressJS public folder volume

I want to create a volume for my "public" folder on Docker on Express App. Because when users upload pictures, I save them to "public/uploads", but when I make changes on code, and have to rebuild with docker-compose run --build, I lose all these images.
I tried to find a way to create a volume but I don't know how to link it.
My Dockerfile only consist of these:
FROM node:8.10.0-alpine
WORKDIR /usr/src/app
COPY package*.json ./
RUN npm install
# RUN npm ci --only=production
COPY . .
CMD [ "npm", "start" ]
My goal is to serve uploaded images from "public/uploads", and don't get them removed upon docker-compose run --build.
According to the official documentation, you can use the --mount flag:
//Dockerfile
FROM node:8.10.0-alpine
WORKDIR /usr/src/app
COPY package*.json ./
RUN npm install
# RUN npm ci --only=production
RUN --mount=target=/some_location_in_file_system,type=bind,source=public/uploads
COPY . .
CMD [ "npm", "start" ]

Resources