"Address already in use" error when using cookiecutter-flask

Question

I'm on OS X 10.14.3. I'm trying to use the nifty-looking cookiecutter-flask project. I have followed the instructions in the README.rst:

cookiecutter https://github.com/sloria/cookiecutter-flask.git
# I named my test ccflask, and used pipenv
cd ccflask
cp .env.example .env
pipenv install --dev
npm install
npm start

The README says that at this point, "You will see a pretty welcome screen." Instead, it's just serving the directory structure inside ccflask/.

This seems to be because flask is never starting:

[FLASK] Loading .env environment variables...
[WEBPACK] Project is running at http://localhost:2992/
[WEBPACK] webpack output is served from http://localhost:2992/static/build/
[FLASK]  * Serving Flask app "autoapp.py" (lazy loading)
[FLASK]  * Environment: development
[FLASK]  * Debug mode: on
[FLASK] Traceback (most recent call last):
[FLASK]   File "/Users/nick/.local/share/virtualenvs/ccflask-bmCIsVly/bin/flask", line 10, in <module>
[FLASK]     sys.exit(main())
[…stack…]
[FLASK]     s.bind(get_sockaddr(hostname, port, address_family))
[FLASK] OSError: [Errno 48] Address already in use
[FLASK] npm ERR! code ELIFECYCLE
[FLASK] npm ERR! errno 1
[FLASK] npm ERR! ccflask@1.0.0 flask-server: `pipenv run flask run`
[FLASK] npm ERR! Exit status 1
[FLASK] npm ERR! 
[FLASK] npm ERR! Failed at the ccflask@1.0.0 flask-server script.
[FLASK] npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

I am new to npm and webpack, so I'm not quite clear what the problem is. When I search for 2992, I find it in package.json:

"webpack-dev-server": "NODE_ENV=debug webpack-dev-server --port 2992 --hot --inline",

and also webpack.config.js:

const publicHost = debug ? 'http://localhost:2992' : '';

I don't know if this looks right, but I assume so? The console spew is quite explicit about both the flask app and the webpack dev server being served from different folders on the same port. I definitely don't have anything else running on 2992, because as soon as I kill npm, localhost:2992 stops responding to web requests. I also grepped the output of ps to be sure. It really does seem as though the npm start process attempts to launch two services using the same port.

Could some dependency have changed? During npm install, I got these warnings:

npm WARN css-loader@1.0.1 requires a peer of webpack@^4.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN less-loader@2.2.3 requires a peer of less@^2.3.1 but none is installed. You must install peer dependencies yourself.
npm WARN url-loader@1.1.2 requires a peer of webpack@^3.0.0 || ^4.0.0 but none is installed. You must install peer dependencies yourself.

But there is a webpack directory in node_modules, along with webpack-sources and webpack-dev-*… so I'm out of ideas.

Any help would be greatly appreciated.

Answer 1

There was indeed a port conflict, but not with 2992. The problem was that I was already running a different flask application on port 5000. Once I turned that off, the cookiecutter code worked as expected. Thanks to kkremitzki on GitHub who helped me sort this out.