Webpack-dev-server: Cant run webpack-dev-server inside of a docker container?

Created on 4 Aug 2016  路  9Comments  路  Source: webpack/webpack-dev-server

Everything works fine when I want to run this through my local webpack server. I want to pack this project into a docker container.

The main page does get served with all the CSS assets intact, but none of the javascript within seems to have come through. I get this error message on my chrome console:

screen shot 2016-08-03 at 6 20 26 pm

My Dockerfile looks like this:

FROM node

# Prepare app directory
RUN mkdir -p /usr/src/app
ADD . /usr/src/app

# Install dependencies
WORKDIR /usr/src/app
RUN npm install

# Build the app
RUN npm build

# Expose the app port
EXPOSE "80:3000"
EXPOSE 885
EXPOSE 3001

# Start the app
CMD node build/server.js

Im using docker compose with the following config:

web:
  build: .
  ports:
    - '80:3000'
    - '885:885'
    - '3001:3001'
  command: npm start

Do I need to expose any other ports? Is there a workaround to this?

Most helpful comment

can be helpful for somebody:
change the binding address to 0.0.0.0

"start": "node_modules/.bin/webpack-dev-server --host 0.0.0.0",
or

  devServer: {
    host: '0.0.0.0',
    port: 80,
    ...
}

All 9 comments

Did you read "Webpack and Docker for Development and Deployment"? It explains the setup quite well.

I just lifted over the .dockerfile and .dockerignore from that post and everything works now. Thanks for the tip!

Cool! Could you close this issue?

can be helpful for somebody:
change the binding address to 0.0.0.0

"start": "node_modules/.bin/webpack-dev-server --host 0.0.0.0",
or

  devServer: {
    host: '0.0.0.0',
    port: 80,
    ...
}

@merapi what if I wanna use subdomains eg my-project.local:3002 (in my case I need to run many projects on different subdomains - each on different port) ?

can be helpful for somebody:
change the binding address to 0.0.0.0

"start": "node_modules/.bin/webpack-dev-server --host 0.0.0.0",
or

  devServer: {
    host: '0.0.0.0',
    port: 80,
    ...
}

works like a charm!!!

Did you read "Webpack and Docker for Development and Deployment"? It explains the setup quite well.

Linking to a paid article as the solution to a question in an open source forum, while understandable, is sus.

Linking to a paid article as the solution to a question in an open source forum, while understandable, is sus.

As is not understanding that the web, and the resultant sites on there, change over time. In 2016, when this was written, Medium was not a subscription service, and subsequently, neither was this article. Medium went partially sub in 2017, doubled down in 2018 and 2019. I feel it would be more useful to the conversation for one to contribute a useful alternative for people finding this rather than criticizing someone for the current state of a contribution made 4 years ago in a landscape that evolves daily.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

adiachenko picture adiachenko  路  3Comments

Ky6uk picture Ky6uk  路  3Comments

antoinerousseau picture antoinerousseau  路  3Comments

piotrszaredko picture piotrszaredko  路  3Comments

mrdulin picture mrdulin  路  3Comments