storybook won't run on localhost

Question

I'm running Storybook 6.1.21. At some point it stopped loading on localhost:6006. On localhost it loads a white page in the browser and logs this to the console:

GET http://localhost:6006/main.daf8ed0c474096531109.bundle.js net::ERR_ABORTED 404 (Not Found)

If I open Storybook on http://192.168.86.137:6006 it works fine.

I'm at at loss for how to troubleshoot this, any ideas?

Shuffleboard

Answer 1

So something else is running on :6006, I'm not sure what it is yet, but it's not loading correctly. If I change storybook to run on a different port it starts on localhost without a problem:

start-storybook -p 6007

Shuffleboard

On Linux, try sudo lsof -i -P -n | grep LISTEN to determine if "node" or anything else is listening on this port – Jeannettejeannie

Answer 2

Empty cache and hard reload resolved this issue for me.

Roman

Yep, deleting node_modules/.cache fixed it. – Trypsin

I was missing the addon console of storybook until I deleted my browser cache... – Amling

Answer 3

Just in case somebody experiences the same problem with laravel sail or some docker environment in general. After installing storybook you have to map the port in the docker-compose.yml file. Add this to you docker-compose.yml

services:
  laravel.test:
    ports:
      - '6006:6006' 

Howbeit

Thanks! Make sure you restart the container to map the new port bindings or you'll still hit the same issue. – Coincident

Answer 4

In your package.json script add the following...

• Prefix with NODE_OPTIONS=--openssl-legacy-provider
• Add -no-manager-cache to parameters

"storybook": "NODE_OPTIONS=--openssl-legacy-provider start-storybook -p -no-manager-cache 6006",

Found this solution here

Calefacient