Home
Support Forums

Storybook + Next + Netlify

Describe the bug
I am getting an error when trying a storybook build using the Netlify next plugin

To Reproduce
Install a next app, then add storybook.
Npm install @netlify/plugin-nextjs
After it’s installed, set up a new site for storybook in Netlify:

build: next build-storybook
output: storybook-static

2:33:01 PM:   Error: The directory "storybook-static" does not contain a Next.js production build. Perhaps the build command was not run, or you specified the wrong publish directory.

System
Please paste the results of npx sb@next info here.


IssueHunt Summary

Backers (Total: $50.00)

Become a backer now!

Or submit a pull request to get the deposits!

Tips

Hi @tolicodes,

Could you link us to a deploy with the problem and possibly share a repo? From the looks of it, it appears that you need to change the publish directory.

I had the same problem. I had a storybook deploy that was working with a create-react-app, but when I switched the repo to a next.js repo that had storybook in it, I got some message in the UI saying that it detected next.js and would therefore change something.

It’s a next.js repo now, but I just need to run build-storybook and deploy that as before. How do I do this?

EDIT: Here’s the complete error in the deploy logs.

Plugin "@netlify/plugin-nextjs" failed

Error: The directory "storybook-static" does not contain a Next.js production build. Perhaps the build command was not run, or you specified the wrong publish directory.
In most cases it should be set to ".next", unless you have chosen a custom "distDir" in your Next config.
If you are using "next export" then you should set the environment variable NETLIFY_NEXT_PLUGIN_SKIP to "true".

I don’t know how this plugin was added. It’s not in my repo. There’s no indication from the plugin page that it’s installed, and when I click “Install” it says

**Error while installing the plugin**

Please try again, but if the problem persists, feel free to [contact us.](https://www.netlify.com/support/)"

Figured it out! Add an environment var NETLIFY_NEXT_PLUGIN_SKIP, set to true. That worked for me.

1 Like

Hey there, @brendanb :wave:

Thanks for coming back and sharing your solution with the Forums! We love knowledge sharing.

Happy building :netliconfetti: