storybook: Storybook running out of memory when building

This is an issue when using storybook in a monorepo (a repo containing many individual packages and their own node_modules folders). It seems that when using default configs, storybook runs out of memory because it is scanning all of the node_modules sub folders. If I remove all the node_modules folders, it works fine. Is there a recommended way to include storybook in a monorepo? I’m thinking I’ll have to use a custom webpack config that excludes the appropriate folders.

Even with 6GB of RAM in docker, the build still fails:

INFO[0062] RUN npm install --unsafe-perm --legacy-peer-deps 
INFO[0062] cmd: /bin/sh                                 
INFO[0062] args: [-c npm install --unsafe-perm --legacy-peer-deps] 
INFO[0062] Pushing layer xxxx.ap-northeast-1.amazonaws.com/.../cache:xxxxxxxx to cache now 
INFO[0062] Running: [/bin/sh -c npm install --unsafe-perm --legacy-peer-deps] 
<--- Last few GCs --->
[113:0x589ab50]   107832 ms: Scavenge 2000.0 (2067.4) -> 1997.6 (2069.1) MB, 16.8 / 0.0 ms  (average mu = 0.723, current mu = 0.475) allocation failure 
[113:0x589ab50]   107936 ms: Scavenge 2001.6 (2069.1) -> 1999.8 (2072.6) MB, 12.5 / 0.1 ms  (average mu = 0.723, current mu = 0.475) allocation failure 
[113:0x589ab50]   108042 ms: Scavenge 2005.4 (2072.6) -> 2003.3 (2091.4) MB, 16.8 / 0.0 ms  (average mu = 0.723, current mu = 0.475) allocation failure 
<--- JS stacktrace --->
FATAL ERROR: MarkCompactCollector: young object promotion failed Allocation failed - JavaScript heap out of memory
Segmentation fault (core dumped)
error building image: error building stage: failed to execute command: waiting for process to exit: exit status 139
Cleaning up file based variables
00:00
ERROR: Job failed: command terminated with exit code 1

I just ran into the same error. For me it helped just setting the creation of sourcemap to false in the .storybook/main.js config for vite 2.9.9 with vue 3.2.25 and sb 6.5.9

async viteFinal(config) {
    config.build.sourcemap = false;
    return config;
}

Since I changed the command from start-storybook -p 6006 -c .storybook to node --max_old_space_size=4096 ./node_modules/@storybook/react/bin/index.js -p 6006 -c .storybook it works for me!

What happens if you set the following in .storybook/main.js:

module.exports = { 
  typescript: { reactDocgen: 'none' }
}

Writing here to say that I have a large production project that builds storybook in CI. Building was fine using SB v5.3 but 6.3 would not work using Webpack 5 because it would run out of memory. Disabling reactDocgen did the trick! Thanks Shilman!

What happens if you set the following in .storybook/main.js:

module.exports = { 
  typescript: { reactDocgen: 'none' }
}

I can confirm that this works.

Although in our case the issue was solved by simply not uglifying storybook build.