Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Storybook does not serve files from CRA public folder #1537

Closed
gihrig opened this issue Jul 28, 2017 · 5 comments
Closed

Storybook does not serve files from CRA public folder #1537

gihrig opened this issue Jul 28, 2017 · 5 comments
Labels
question / support

Comments

@gihrig
Copy link

gihrig commented Jul 28, 2017

I attempted to follow "The guidelines for contributing" "Reproductions" script, but I couldn't get that to work, see #1536.

Here's an abbreviated version that describes the problem:

create-react-app tester
cd tester
echo "foobar" > public/file
yarn start
# in another terminal
curl localhost:3000/file # outputs "foobar" <--- Works as expected
# in first terminal
getstorybook
yarn storybook
# in another terminal
curl localhost:6006/file # outputs "foobar" <--- "Cannot GET /file"

Specifically the error is wrapped in an html file:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Error</title>
</head>
<body>
<pre>Cannot GET /file</pre>
</body>
</html>

I have tried with files of various extensions (.html, .json, .ico, .ttf, .woff, etc.), none are served.

Any ideas on what needs to be done to get Storybook to serve files from a CRA app's public folder and subdirectories?
@ndelangen
Copy link
Member

Can you try a npm install after getstorybook ?

@gihrig
Copy link
Author

gihrig commented Jul 28, 2017

@ndelangen, Thanks for the reply 😄

I have modified my test script to use npm and add your advised install step. Still fails to read file, same as before.

Now the script is as follows:

npm -v 4.0.2
node -v 7.10.1

Also tried
npm -v 5.3.0
node -v 8.2.1

create-react-app tester
cd tester
echo "foobar" > public/file
npm start
# in another terminal
curl localhost:3000/file # outputs "foobar" <--- Works as expected
# in first terminal
getstorybook
npm install # <--- no screen output, npm 4: 15 seconds, npm 5: 1 min+ very chatty , 
npm run storybook
# in another terminal
curl localhost:6006/file # outputs "foobar" <--- "Cannot GET /file"

More info:

I think this may be a configuration problem...

Running CRA, npm start http://localhost:3000/favicon.ico returns the react favicon.

Running Storybook npm run storybook http://localhost:6006/favicon.ico returns the Storybook favicon.

Storybook is running and serving data, just not serving from tester/public.

@ndelangen
Copy link
Member

Can you check this documentation page, and see if this solves the problem?

https://storybook.js.org/configurations/serving-static-files/#docs-content

Storybook does not automatically serve the same folder statically as cra.

@gihrig
Copy link
Author

gihrig commented Jul 28, 2017

RTFM, ugh, 😊

@ndelangen That solves it. Thank you so much for the help 😄

@gihrig gihrig closed this as completed Jul 28, 2017
@ndelangen
Copy link
Member

My pleasure!

@dependencies dependencies bot mentioned this issue Apr 16, 2018
Merged
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
question / support
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
2 participants
@gihrig @ndelangen