Webpack not found when hitting docker container with docker compose

Question

I made docker container for my project, and had a trouble with connection to localhost. When i provided a particular port(8000), connect was refused by peer. Then i found a solution. Providing ---network host for docker run command helped and everything worked fine. Then i made docker-compose file and tried to up container and face with the same problem. Is there equivalent of --network host in docker-compose? Providing network_mode: "host" wasn't help. Idk why but nmap doesn't show 8000 port. With --network host, port was 8000 and nmap saw it. Application worked fine on 80, 8000, 0.0.0.0 etc. P.S. When i used only dockerfile flag -p dor mapping ports didn't help too

$ sudo nmap localhost
Starting Nmap 7.80 ( https://nmap.org ) at 2023-09-04 20:37 +09
Nmap scan report for localhost (127.0.0.1)
Host is up (0.0000030s latency).
Not shown: 998 closed ports
PORT     STATE SERVICE
631/tcp  open  ipp
5432/tcp open  postgresql

Without network_mode:

sudo nmap localhost
Starting Nmap 7.80 ( https://nmap.org ) at 2023-09-04 20:39 +09
Nmap scan report for localhost (127.0.0.1)
Host is up (0.0000020s latency).
Not shown: 997 closed ports
PORT     STATE SERVICE
631/tcp  open  ipp
5432/tcp open  postgresql
8000/tcp open  http-alt

but curl response with:

curl: (56) Recv failure: Connection reset by peer

Below Dockerfile and docker-compose.yml:

Dockerfile:

FROM node:16.17.0-alpine 

WORKDIR /app

COPY package.json .

RUN yarn 

COPY . .

ENV PORT 8000

EXPOSE $PORT

docker-compose.yml:

version: "3.8"

services: 
  front: 
    build: 
      context: .
      dockerfile: Dockerfile
      args:
        NODE_MAJOR: '16.17.0'
        YARN_VERSION: '1.22.19'
    image: front-dev:1.0.0
    container_name: front-dev
    volumes:
      - .:/app:cached
      - node_modules:/app/node_modules/
    stdin_open: true
    tty: true
    env_file:
      - .env
    ports:
      - "8000:8000"
    environment:
      - NODE_ENV=development
volumes:
  node_modules:

.env file:

HOST=127.0.0.1
PORT=8000

API_DOMAIN=

I tried to switch host to 0.0.0.0 didnt help

UPD: I finnaly can start my container, but not a usual way. Now i have another trouble. When i starting container, i have an error:

front-dev  | /bin/sh: webpack: not found
front-dev  | error Command failed with exit code 127.

But if i attach container with docker run -it <image_id> sh and after that do yarn start inside container, everything works fine, but application ups on strange host. Logs below:

user@user-MS-3B41:~/projects/app/front$ docker compose -f docker-compose.yml --env-file .env up
[+] Running 1/0
 ✔ Container front-dev  Created                                                                                                                                          0.0s 
Attaching to front-dev

yarn run v1.22.19
$ webpack serve --config webpack.config.dev.js
front-dev  | /bin/sh: webpack: not found

front-dev  | error Command failed with exit code 127.

info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
front-dev exited with code 127
user@user-MS-3B41:~/projects/app/front$ sudo docker images
REPOSITORY      TAG       IMAGE ID       CREATED         SIZE
front-dev   1.0.0     91fca72bf5b5   3 minutes ago   1.7GB
user@user-MS-3B41:~/projects/app/front$ sudo docker run -it 91fca72bf5b5 sh
/app # webpack --version
sh: webpack: not found
/app # yarn -v
1.22.19
/app # node -v
v16.17.0
/app # webpack -v
sh: webpack: not found
/app # yarn start
yarn run v1.22.19
$ webpack serve --config webpack.config.dev.js
<i> [webpack-dev-server] Project is running at:
<i> [webpack-dev-server] Loopback: http://localhost:8000/
<i> [webpack-dev-server] On Your Network (IPv4): http://172.17.0.2:8000/
<i> [webpack-dev-server] Content not from webpack is served from '/app/public' directory
<i> [webpack-dev-server] 404s will fallback to '/index.html'
assets by info 29.1 MiB [immutable]
  assets by path *.js 29 MiB
    asset 4a270-vendors.js 26.5 MiB [emitted] [immutable] (name: vendors) (id hint: vendor)
    asset 1008a-front.js 2.37 MiB [emitted] [immutable] (name: front)
    asset 53bf9-runtime.js 53.1 KiB [emitted] [immutable] (name: runtime)
    + 4 assets
  assets by path static/*.otf 105 KiB
    asset static/75351-f314a..otf 32.2 KiB [emitted] [immutable] [from: assets/fonts/HelveticaNeue-Light.otf] (auxiliary name: front)
    asset static/94749-59734..otf 24.4 KiB [emitted] [immutable] [from: assets/fonts/HelveticaNeue-Bold.otf] (auxiliary name: front)
    asset static/68074-a99bc..otf 24.4 KiB [emitted] [immutable] [from: assets/fonts/HelveticaNeue-Medium.otf] (auxiliary name: front)
    asset static/74920-b18c0..otf 23.5 KiB [emitted] [immutable] [from: assets/fonts/HelveticaNeue-Roman.otf] (auxiliary name: front)
assets by path *.css 71.6 KiB
  asset front.css 69.4 KiB [emitted] (name: front)
  asset app_sections_OrgChart_index_tsx.css 2.23 KiB [emitted]
asset index.html 739 bytes [emitted]
Entrypoint front 29 MiB (105 KiB) = 53bf9-runtime.js 53.1 KiB 4a270-vendors.js 26.5 MiB front.css 69.4 KiB 1008a-front.js 2.37 MiB 4 auxiliary assets
webpack compiled successfully in 9613 ms

I think this should be already answered here: stackoverflow.com/questions/56582446/… — roirodriguez
– roirodriguez, Commented Sep 5, 2023 at 10:18
@roirodriguez I saw it, network_mode: "host" doesn't help at all. I would prefer to start the container on particular port. Now i can start it, but only from inside the container with shell and the host on which apllication is starting looks random for me. 172.17.0.2:8000 it's not in my .env file, now i started without network host, i guess it depends on intenal docker settings — kvaizer999
– kvaizer999, Commented Sep 5, 2023 at 10:29
I think i can't help, but here's my last try: It seems a bit strange to mount node_modules inside the container... Isn't it already created inside the container via the yarn command at your dockerfile? I though maybe mounting the outside node_modules causes some incompatibility inside, and it seems you should not need it — roirodriguez
– roirodriguez, Commented Sep 5, 2023 at 10:42
Also and related: docs.docker.com/engine/reference/builder/#copy. You're copying your full '.' directory inside the container, which i guess includes node_modules and package.json, right? If that's the case you should just COPY . ., then run yarn (not before copy but after) if necessary forcing to completely redo node_modules. After that you also remove the node_modules volume from your docker_compose. Let me know if any of this helps — roirodriguez
– roirodriguez, Commented Sep 5, 2023 at 10:51

roirodriguez · Accepted Answer · 2023-09-05 11:23:03Z

I think the problem may be your node_modules/ outside the container gets copied inside causing some kind of incompatibility. Instead of that try:

FROM node:16.17.0-alpine 

WORKDIR /app

COPY . .

# the issue: run yarn AFTER copying the outside node_modules
RUN rm -rf node_modules/ && yarn

ENV PORT 8000

EXPOSE $PORT

And then remove that node_modules volume mount from your docker-compose.yml.

Note that this all happens because node_modules installed packages can depend on local paths, native libs, etc, so as you don't have the same env inside the container and outside it, you should force node_modules to be fully recreated inside the container. Your case seems to be you've got webpack installed globally outside and depended on package.json, so when you run yarn inside it gets installed locally, but if you just copy the outside node_modules then webpack isn't anywhere inside the container. Just guessing, and as i said earlier there could be other issues also.

So, in brief: Never copy node_modules inside a container, it can contain host / environment dependant modules which doesn't match your container env.

Collectives™ on Stack Overflow

Webpack not found when hitting docker container with docker compose

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related