FATAL ERROR: MarkCompactCollector: young object promotion failed Allocation failed - JavaScript heap out of memory

[ConorLambert]

Describe the bug When trying to do run storybook using "npm run docs:json && start-storybook -p 6006", it's gets to "87% sealing code generation" and then fails with the following out of memory error:

`<--- Last few GCs --->

[9428:00000208CE82BE90] 103193 ms: Scavenge 1669.8 (1736.3) -> 1669.8 (1736.3) MB, 1388.6 / 0.3 ms (average mu = 0.991, current mu = 0.852) allocation failure [9428:00000208CE82BE90] 111857 ms: Mark-sweep 2085.8 (2152.3) -> 1774.5 (1907.0) MB, 1515.1 / 1.4 ms (+ 9.8 ms in 2 steps since start of marking, biggest step 6.4 ms, walltime since start of marking 16034 ms) (average mu = 0.966, current mu = 0.955) al

<--- JS stacktrace --->

FATAL ERROR: MarkCompactCollector: young object promotion failed Allocation failed - JavaScript heap out of memory 1: 00007FF6C1B2412F napi_wrap+133311 2: 00007FF6C1ABDD06 SSL_get_quiet_shutdown+63062 3: 00007FF6C1ABEB9D node::OnFatalError+301 4: 00007FF6C23A216E v8::Isolate::ReportExternalAllocationLimitReached+94 5: 00007FF6C2386F3D v8::SharedArrayBuffer::Externalize+781 6: 00007FF6C223001C v8::internal::Heap::EphemeronKeyWriteBarrierFromCode+1516 7: 00007FF6C221AA9B v8::internal::NativeContextInferrer::Infer+59739 8: 00007FF6C21FFD6F v8::internal::MarkingWorklists::SwitchToContextSlow+56975 9: 00007FF6C2213A5B v8::internal::NativeContextInferrer::Infer+31003 10: 00007FF6C220AB3D v8::internal::MarkCompactCollector::EnsureSweepingCompleted+6285 11: 00007FF6C2212CAE v8::internal::NativeContextInferrer::Infer+27502 12: 00007FF6C2216CFB v8::internal::NativeContextInferrer::Infer+43963 13: 00007FF6C22206F2 v8::internal::ItemParallelJob::Task::RunInternal+18 14: 00007FF6C2220681 v8::internal::ItemParallelJob::Run+641 15: 00007FF6C21F3CE3 v8::internal::MarkingWorklists::SwitchToContextSlow+7683 16: 00007FF6C220AFEC v8::internal::MarkCompactCollector::EnsureSweepingCompleted+7484 17: 00007FF6C2209824 v8::internal::MarkCompactCollector::EnsureSweepingCompleted+1396 18: 00007FF6C2207398 v8::internal::MarkingWorklists::SwitchToContextSlow+87224 19: 00007FF6C2235E01 v8::internal::Heap::LeftTrimFixedArray+929 20: 00007FF6C2237EF5 v8::internal::Heap::PageFlagsAreConsistent+789 21: 00007FF6C222D111 v8::internal::Heap::CollectGarbage+2049 22: 00007FF6C222B315 v8::internal::Heap::AllocateExternalBackingStore+1349 23: 00007FF6C224B78B v8::internal::Factory::NewFillerObject+203 24: 00007FF6C1F79F91 v8::internal::interpreter::JumpTableTargetOffsets::iterator::operator=+1409 25: 00007FF6C242D59D v8::internal::SetupIsolateDelegate::SetupHeap+474253 26: 0000009827D5CE1B`

To Reproduce Steps to reproduce the behavior:

Run "npm run docs:json && start-storybook -p 6006"

Additional context This is happening on a company codebase which is quite large. I did notice that the documentation.json file that is produced during the run process is very large (117 MB). Is this normal? Also, I only have about 3 small stories.

Code Snippets

main.js module.exports = { "stories": [ "../src/**/*.stories.mdx", "../src/**/*.stories.@(js|jsx|ts|tsx)" ], "addons": [ "@storybook/addon-knobs", "@storybook/addon-links", "@storybook/addon-essentials", "@storybook/addon-actions", "@storybook/addon-jest" ], "core": { "builder": "webpack5" } }

preview.js `import { setCompodocJson } from '@storybook/addon-docs/angular'; import docJson from '../documentation.json';

import { withTests } from '@storybook/addon-jest'; import results from '../.jest-test-results.json';

setCompodocJson(docJson);

export const parameters = { actions: { argTypesRegex: '^on[A-Z].*' }, controls: { matchers: { color: /(background|color)$/i, date: /Date$/ } }, docs: { inlineStories: true } }; `

tsconfig.json { "extends": "../tsconfig.app.json", "compilerOptions": { "types": [ "node" ] }, "exclude": [ "../src/test.ts", "../src/**/*.spec.ts", "../projects/**/*.spec.ts" ], "include": [ "../src/**/*", "../projects/**/*" ], "files": [ "./typings.d.ts" ] }

package.json { "name": "arcsim-platform-ui", "version": "0.0.0", "scripts": { "ng": "ng", "start": "ng serve", "build": "ng build", "watch": "ng build --watch --configuration development", "test": "ng test --coverage --json --outputFile=.jest-test-results.json", "test:watch": "ng test --watch", "test-jest": "jest", "test-jest:coverage": "jest --coverage", "lint": "tsc --noEmit && eslint . --ext js,ts --quiet --fix", "docs:json": "compodoc -p ./tsconfig.json -e json -d .", "storybook": "npm run docs:json && start-storybook -p 6006", "build-storybook": "npm run docs:json && build-storybook" }, "private": true, "dependencies": { "@angular-slider/ngx-slider": "^2.0.4", "@angular/animations": "~12.2.0", "@angular/cdk": "^12.2.13", "@angular/common": "~12.2.0", "@angular/compiler": "~12.2.0", "@angular/core": "~12.2.0", "@angular/forms": "~12.2.0", "@angular/material": "^12.2.13", "@angular/material-moment-adapter": "^12.2.12", "@angular/platform-browser": "~12.2.0", "@angular/platform-browser-dynamic": "~12.2.0", "@angular/router": "~12.2.0", "@microsoft/signalr": "^6.0.5", "@swimlane/ngx-datatable": "^20.0.0", "diff-match-patch": "^1.0.5", "moment": "^2.29.1", "ng-multiselect-dropdown": "^0.3.8", "ngx-scrollbar": "^9.0.0", "ngx-spinner": "^13.1.1", "ngx-text-diff": "^0.6.0", "rxjs": "~6.6.0", "storybook": "^6.5.10", "tslib": "^2.3.0", "zone.js": "~0.11.4" }, "devDependencies": { "@angular-builders/jest": "^12.1.1", "@angular-devkit/build-angular": "~12.2.1", "@angular/cli": "~12.2.1", "@angular/compiler-cli": "~12.2.0", "@angular/elements": "^12.2.1", "@babel/core": "^7.15.0", "@compodoc/compodoc": "^1.1.14", "@storybook/addon-actions": "^6.5.10", "@storybook/addon-essentials": "^6.5.10", "@storybook/addon-jest": "^6.5.10", "@storybook/addon-knobs": "^6.3.1", "@storybook/addon-links": "^6.5.10", "@storybook/angular": "^6.5.10", "@storybook/builder-webpack5": "^6.5.10", "@storybook/manager-webpack5": "^6.5.10", "@types/diff-match-patch": "^1.0.32", "@types/jest": "^27.0.0", "@types/node": "^12.11.1", "@typescript-eslint/eslint-plugin": "^4.29.1", "@typescript-eslint/parser": "^4.29.1", "@webcomponents/custom-elements": "^1.5.0", "babel-loader": "^8.2.2", "eslint": "^7.32.0", "eslint-config-prettier": "^8.3.0", "eslint-config-standard": "^16.0.3", "eslint-plugin-import": "^2.24.0", "eslint-plugin-node": "^11.1.0", "eslint-plugin-prettier": "^3.4.0", "eslint-plugin-promise": "^5.1.0", "eslint-plugin-react": "^7.24.0", "eslint-plugin-standard": "^5.0.0", "jest": "^27.0.6", "jest-preset-angular": "^9.0.5", "karma-coverage": "~2.0.3", "prettier": "^2.3.2", "typescript": "~4.3.5", "webpack": "5.39.1" }, "jest": { "preset": "jest-preset-angular", "moduleNameMapper": { "@app/(.*)$": "<rootDir>/src/app/$1", "@env/(.*)": "<rootDir>/src/environments/$1" }, "setupFilesAfterEnv": [ "<rootDir>/setupJest.ts" ], "testPathIgnorePatterns": [ "<rootDir>/node_modules/", "<rootDir>/dist/" ], "globals": { "ts-jest": { "tsConfig": "<rootDir>/tsconfig.spec.json", "stringifyContentPathRegex": "\\.html$" } } } }

System: OS: Windows 10 Device: ThinkPad Laptop Browser: Chrome Framework: Angular Addons: "@storybook/addon-knobs", "@storybook/addon-links", "@storybook/addon-essentials", "@storybook/addon-actions", "@storybook/addon-jest" Version: 6.5.10

[RafalBesztak]

There's so quiet. Any progress on the issue? I have similar heap error on pipeline after add to package.json storybook's dependencies.

FATAL ERROR: Ineffective mark-compacts near heap limit Allocation failed - JavaScript heap out of memory

[AndyRand]

Any news on this issue? Actually having the same

[shilman]

Please try upgrading to the latest prerelease & if this is still a problem let me know!

Migration guide: https://storybook.js.org/migration-guides/7.0

[gyurielf]

It's still actual: "storybook": "^7.0.27"

<--- Last few GCs --->
[100:0x66de9e0]    70985 ms: Scavenge (reduce) 2016.7 (2076.3) -> 2012.5 (2061.5) MB, 17.6 / 0.0 ms  (average mu = 0.384, current mu = 0.375) allocation failure; 
[100:0x66de9e0]    71330 ms: Scavenge (reduce) 2017.9 (2061.5) -> 2017.8 (2067.2) MB, 19.7 / 0.0 ms  (average mu = 0.384, current mu = 0.375) allocation failure; 
[100:0x66de9e0]    71753 ms: Scavenge (reduce) 2023.7 (2067.4) -> 2023.5 (2073.2) MB, 32.2 / 0.0 ms  (average mu = 0.384, current mu = 0.375) allocation failure; 
<--- JS stacktrace --->
FATAL ERROR: Ineffective mark-compacts near heap limit Allocation failed - JavaScript heap out of memory
 1: 0xb7b3e0 node::Abort() [node]
 2: 0xa8c8aa  [node]
 3: 0xd69100 v8::Utils::ReportOOMFailure(v8::internal::Isolate*, char const*, bool) [node]
 4: 0xd694a7 v8::internal::V8::FatalProcessOutOfMemory(v8::internal::Isolate*, char const*, bool) [node]
 5: 0xf46ba5  [node]
 6: 0xf47aa8 v8::internal::Heap::RecomputeLimits(v8::internal::GarbageCollector) [node]
 7: 0xf57fb3  [node]
 8: 0xf58e28 v8::internal::Heap::CollectGarbage(v8::internal::AllocationSpace, v8::internal::GarbageCollectionReason, v8::GCCallbackFlags) [node]
 9: 0xf5bff5 v8::internal::Heap::HandleGCRequest() [node]
10: 0xeda14f v8::internal::StackGuard::HandleInterrupts() [node]
11: 0x12da5f5 v8::internal::Runtime_StackGuard(int, unsigned long*, v8::internal::Isolate*) [node]
12: 0x1707b79  [node]
Aborted (core dumped)