[Bug]: Build hangs at "Output directory" #22985
Comments
|
I've also tried running a build with DEBUG=* but there were no obvious errors or useful output at the end of the log. I've also tried to utilize why is node running, but with this happening so infrequently it is difficult or impossible to have this work. |
pm0u
changed the title
|
I've created a debug script that I think we will use for builds going forward to help pinpoint the issue. If we use this on every build hopefully in a few days we can get a useful log // @ts-check
const { spawn } = require("node:child_process")
const chalk = require("chalk")
const waitMinutes = 10
const waitSeconds = waitMinutes * 60
const waitMilliseconds = waitSeconds * 1000
const whyNode = spawn(
"why-is-node-running",
["./node_modules/.bin/storybook", "build"],
{ stdio: ["inherit", "pipe", "inherit"] }
)
const pidRegex = /kill -SIGUSR1 (\d+) for logging/
/** @type {string|null} */
let storybookPid = null
whyNode.stdout.on("data", (data) => {
const match = pidRegex.exec(data)
if (match !== null) {
const [, pid] = match
storybookPid = pid
}
console.log(/** @type {Buffer} */ (data).toString("utf8"))
})
// wait until time set above, then log why node is running
const timeout = setTimeout(() => {
console.error(
chalk.redBright(
`\n\nStorybook appears to be stuck, sending -SIGUSR1 to PID ${storybookPid}...\n`
)
)
if (storybookPid !== null) {
spawn("kill", ["-SIGUSR1", storybookPid])
setTimeout(() => {
console.log(chalk.redBright("\nKilling storybook process...\n"))
whyNode.kill("SIGTERM")
if (storybookPid !== null) {
spawn("kill", ["-SIGTERM", storybookPid])
console.log(chalk.redBright("\nExiting...\n"))
}
process.exit(1)
}, 30000)
return
}
console.log(chalk.red("No PID for storybook found"))
process.exit(1)
}, waitMilliseconds)
// When storybook is done building, close up our timeout so the process can end - in case it hasn't run yet
whyNode.on("close", () => {
clearTimeout(timeout)
})Edit: updated script to fully working latest version |
|
Had a deployment fail today and the output of the above script was this: not what I expected to see, not sure what that means? increasing the time until terminating the storybook process in case the builders are less powerful and the output was cut. |
|
I have confirmed on multiple builds that there is nothing output from the why is node running process when this gets stuck: This happens for me (both getting stuck and no output from why-is-node-running) locally as well as in CI. It would be great to get some input for how to debug this further from the storybook team. I've confirmed that if I set the wait time to be very short (like 6s) to when storybook is obviously doing something there are multiple threads/stacktraces reported. |
|
We have the same thing with Storybook 7.0.11 on our CI, any idea how to fix it? UPD: I managed to fix it with by adding |
|
Thanks @pm0u for your detailed report & debugging attempts. I've reached out to our team to see if there are any suggestions for how to better track this down. I'm guessing this is something specific to your setup and it would be hard to create a standalone reproduction for, but if you're up for trying you can check out https://storybook.new or see repro docs. Thank you! 🙏 |
|
@shilman totally understand, it'll take a little time for me to create a repro as there is quite a few moving parts in the original project. In the meantime, after @osovv suggested changing that particular line/file I found it here: storybook/code/lib/core-server/src/build-static.ts Lines 218 to 233 in 8b9ffc7 This led me to wonder if the culprit could be some separate thread/task that is spurred by the telemetry reporting. I thought this could possibly lead to no output from the main storybook thread based on this comment in the why-node-is-running readme:
For now, I have disabled telemetry on our CI builds and this seems to have immediately improved the issue. I had one particular branch where this seemed to hang pretty reliably and it has now proceeded without issue across several builds. I'm going to continue monitoring. |
|
@pm0u I originally disabled telemetry and it still hung up |
|
@osovv sorry to hear, going to continue to monitor to see if it resolves for us... best of luck in your search. |
|
@tmeasday here is what my NextJS config looks like: module.exports = {
reactStrictMode: true,
swcMinify: true,
images: {
remotePatterns: [
{
hostname: "cdn.sanity.io",
protocol: "https",
pathname: `images/${process.env.NEXT_PUBLIC_SANITY_PROJECT_ID}/**`,
},
],
deviceSizes: [640, 750, 828, 1080, 1200, 1600, 1920, 2048, 3840],
},
rewrites: async () => {
return [
{
source: "/apple-app-site-association",
destination: "/apple-app-site-association.json",
},
]
},
}This is exported and imported to the root const nextConfig = require("./configs/next")
const createNextPluginPreval = require("next-plugin-preval/config")
const withNextPluginPreval = createNextPluginPreval()
let withBundleAnalyzer = (/** @type {any} */ args) => args
if (process.env.ANALYZE === "true") {
withBundleAnalyzer = require("@next/bundle-analyzer")({
enabled: true,
})
}
module.exports = withNextPluginPreval(withBundleAnalyzer(nextConfig))And storybook config, which does include some env injections that end up in webpack I assume: const config = {
stories: [], // omitted for brevity
addons: [
"@storybook/addon-links",
"@storybook/addon-essentials",
"@storybook/addon-interactions",
"@storybook/addon-a11y",
],
staticDirs: [
{
from: "../public",
to: "public",
},
{
from: "../storybook/static",
to: "static",
},
],
framework: {
name: "@storybook/nextjs",
options: {},
},
core: {},
webpackFinal: (config) => {
const rules = config.module?.rules
if (!rules) {
throw new Error("No webpack rules found!")
}
// Adds next preval compatibility to storybook webpack
rules.push({
test: /\.preval\.(t|j)sx?$/,
loader: require.resolve("next-plugin-preval/loader"),
})
return config
},
docs: {
autodocs: "tag",
},
env: (config) => ({
...config,
NEXT_PUBLIC_SANITY_PROJECT_ID:
process.env.NEXT_PUBLIC_SANITY_PROJECT_ID ?? "",
NEXT_PUBLIC_FACEBOOK_APP_ID: process.env.NEXT_PUBLIC_FACEBOOK_APP_ID ?? "",
NEXT_PUBLIC_FACEBOOK_CLIENT_TOKEN:
process.env.NEXT_PUBLIC_FACEBOOK_CLIENT_TOKEN ?? "",
}),
}I suppose the obvious red flag here is I re-read the note about un-refed timers several more times and now see that I misunderstood initially, you are correct this shouldn't impact us (Node 18) |
|
@pm0u is your issue reproducable consistently? Is there some way you could try dropping the IIUC the bundle analyzer isn't being used so I'd say is unlikely to be relevant. |
|
@tmeasday I did have one commit that at one point, inexplicably, seemed to get stuck reliably. I can look into seeing if dropping that works. I will add, FWIW, the reason that particular branch/commit stopped hanging was because I disabled telemetry... since disabling telemetry we have had over 30+ deploys without issue. In the past this issue would pop up within a few deploys typically (and on that particular problematic branch/commit it was 5+ in a row) . Not saying this is resolved for certain, but there has at least been a change in behavior with telemetry disabled. I will find some time to look into the preval plugin |
|
Well I think the telemetry does do some requests in the background so it's believable that it could hold the process up waiting on them I guess. I'm not sure why it happens here and not elsewhere though 🤷 |
|
As one more data point, we were experiencing this hang about 1 in 5 runs on local macbook pro m1s. We had telemetry disabled in main.js. This wasn't enough (per the note in https://storybook.js.org/docs/react/configure/telemetry#how-to-opt-out that there is an event prior to processing main.js). Disabling it on the command line via In case helpful, here's a |
|
Ok, interesting @tony-scio. We'll investigate. In the meantime, the |
|
@tony-scio what is this line? I don't see any such intervals in the SB codebase. What version are you on? |
That was how I hacked in why-is-node-running when diagnosing. https://github.com/mafintosh/why-is-node-running#usage |
|
@tony-scio I'm not sure I know how to read that trace (are you sure it was the full thing?) but I don't see anything in there that looks like it has anything to do with telemetry. Most of the entries are coming from the builder which is a bit weird if building is done. I'm not sure about the If you disregard them, then what's left is basically just some calls from inside https://www.npmjs.com/package/@ndelangen/get-tarball, which is odd because it certainly isn't used at all (it's only used during You could try commenting out the import of it (here in the source code), and see how that affects things? |
|
Hi there! Thank you for opening this issue, but it has been marked as |
|
I'm afraid we need to close this issue for now, since we can't take any action without the requested reproduction or additional information. But please don't hesitate to open a new issue if the problem persists – we're always happy to help. Thanks so much for your understanding. |
|
To add, we've seen the same issue after updating from SB 6 to 7 using Node 18. Setting N.B: I noticed this in the docs, I wonder if it's related as it would explain why the disableTelemetry option didn't work but the flag did:
|
|
in my case it was because I had some stories fully commented out, they were mentioned at the top of the logs, but the process didn't quit it was stuck instead |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Describe the bug
We have a storybook setup using the NextJS framework and it seems to randomly hang at the step of
info => Output directory: /vercel/path0/apps/joinhandshake-web/storybook-staticOutput from recent build on Vercel: https://gist.github.com/pm0u/7e58e553cf3eee2ea07d9fc086d4a095
At this point it will hang for up to 45mins, which is the maximum build time on Vercel. It does also occasionally happen locally on MacOS. It does not happen every build.
This seems to have started with the upgrade to v7 and has occurred from versions
7.0.4to7.0.18. The first deployment we had this occur on, this is the package.json:The previous commit had the following package.json:
There were 2 changes - adding jiti (which has now been removed in the latest/first package.json, problem persists) and moving
eslint-plugin-tailwindcssto devDeps - I don't think either of these changes are likely culprits.Other things I've tried:
To Reproduce
No response
System
Environment Info: System: OS: macOS 12.6.5 CPU: (10) arm64 Apple M1 Max Binaries: Node: 18.15.0 - ~/.nvm/versions/node/v18.15.0/bin/node Yarn: 1.22.19 - ~/.nvm/versions/node/v18.15.0/bin/yarn npm: 9.5.0 - ~/.nvm/versions/node/v18.15.0/bin/npm Browsers: Chrome: 114.0.5735.106 Firefox: 112.0.2 Safari: 16.5Additional context
No response
The text was updated successfully, but these errors were encountered: