Getting webpack-dev-server to run in cloud9



Hi folks, webpack newbie but have been using cloud9 for learning node/express and i absolutely love it. now im trying to learn react and hitting a brick wall because every tutorial out there runs webpack-dev-server on localhost and of course cloud9 doesnt let you do that.

I am following this tutorial:
and i am dying where it says to do npm start which then of course runs to localhost and its the end of the road for me.

Here is what i have reviewed so far that has not helped:

edit: this guy has obviously run in the same issue and i have no idea what he did:

please help a newbie out?


I have similar problem following this book and forum:
It seems Webpack does not work with Cloud 9
Please prove me wrong.


this guy claimed to have a solution a while ago but i just tried it and cant get it working (still directs to localhost when you run npm start). can anyone at cloud9 advise?


You can specify the host with the --host flag when running webpack. In that repository you linked they use npm run dev to start it which runs this script:

NODE_ENV=development webpack-dev-server --host $IP --port $PORT --config --progress --hot

$IP is set to and $PORT is set to 8080 in Cloud9 by default


thank you. It does not help me. How can I run foreman for Rails app that uses procfile?


This is the error:

_Could not load manifest from webpack-dev-server at http://localhost:3808/webpack/manifest.json - is it running, and is stats-webpack-plugin loaded? (original error Failed to open TCP connection to localhost:3808 (Connection refused - connect(2) for "localhost" port 3808)_)


_rails: bundle exec rails server -p$PORT -b$IP_ _webpack: ./node_modules/.bin/webpack-dev-server --host $IP --port $PORT --config config/webpack.config.js --progress --hot


There should be a space between the -p and $PORT in your rails command. It should be bundle exec rails server -p $PORT -b $IP


hey tim, you’ve been really patient! thanks for your response. i confess I had completely given up on cloud9 and went local before i read this. I will give a try tonight and report back if success.


thank you. I actually had spaces.
It did not work without
var devServerPort = process.env.PORT;

It still does not work as it should. Application entry point application.js does not print Hello world in the console…
var config = {
entry: {
‘application’: ‘./webpack/application.js’
I will try to figure this out…



I started from a new ws…
error: GET 404 (Not Found)

i am not giving up yet.


That error can be ignored, it just appears because browsers try to automatically download favicon.ico to show a picture in the browser tab, and your project doesn’t have one yet.


Thank you. OK I can ignore this error but it does not print test message on the console and does not load root page… Instead it loads my workspace content… I used yarn to manage components. I could not find a rails app that worked with webpack.


If you run the production pack (the one translates back to JavaScript), then use the native server on C9 to run the NEW html file created by webpack (like you would a non react file), you do not need the webpack dev server. I don’t know if you can debug but you can use the dev tools in your browser to see what is happening. Chrome has a react console extension.


thank you. I use webpack because i am leaning… But I am not sure if I should give up webpack or c9.



thank you. I think I know what is the problem:

But I am not sure how to make it find application webpack.config.js

Error: ENOENT: no such file or directory, open ‘/home/ubuntu/workspace/shine/node_modules/webpack-dev-server/client/live.html’

instead it runs node_modules/webpack-dev-server/client/live.html’

Any ideas??



You can’t have the rails server and the webpack-dev-server running on the same port.

That said, I don’t know how to make this work, either.

I’m trying to use the 5.1 version with webpacker, and have tried a few things, including changing the line that sets devServerUrl to no avail.


Take a look at this:

Hope it helps. Let me know if you still need help.


Thanks, I’ll give it a go! Looks like it will work.


Thanks for sharing your approach! But now I have another error and can’t figure it out :confused:

Webpack dev server starts without problems:

But in browser console I get error 503 (Service Unavailable):

And after each workspace restart - a line that was added with

echo “ $C9_HOSTNAME” | sudo tee -a /etc/hosts

is missing and I have to run this again…

Can you point me towards right solution?


i find simple solution

  1. run this command
    echo “ $C9_HOSTNAME” | sudo tee -a /etc/hosts

  2. in webpacker.yml property of https must be false
    port: 8081
    https: false

  3. visit your site on, not https protocol