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

[Bug]: FATAL ERROR: Reached heap limit Allocation failed - JavaScript heap out of memory #19994

Open
JavaVista opened this issue Nov 29, 2022 · 5 comments
Open

[Bug]: FATAL ERROR: Reached heap limit Allocation failed - JavaScript heap out of memory #19994

JavaVista opened this issue Nov 29, 2022 · 5 comments
Labels
bug needs triage

Comments

@JavaVista
Copy link

Describe the bug

When I run npm run storybook

<--- Last few GCs --->

[18608:0000019F7D759F80]    56483 ms: Mark-sweep 4050.9 (4136.7) -> 4048.2 (4136.7) MB, 4351.7 / 0.0 ms  (average mu = 0.193, current mu = 0.056) allocation failure scavenge might not succeed
[18608:0000019F7D759F80]    62262 ms: Mark-sweep 4063.9 (4136.7) -> 4061.8 (4165.2) MB, 5671.4 / 0.0 ms  (average mu = 0.100, current mu = 0.019) allocation failure scavenge might not succeed


<--- JS stacktrace --->

FATAL ERROR: Reached heap limit Allocation failed - JavaScript heap out of memory
 1: 00007FF7973D013F v8::internal::CodeObjectRegistry::~CodeObjectRegistry+112495
 2: 00007FF79735F396 DSA_meth_get_flags+65526
 3: 00007FF79736024D node::OnFatalError+301
 4: 00007FF797C919EE v8::Isolate::ReportExternalAllocationLimitReached+94
 5: 00007FF797C7BECD v8::SharedArrayBuffer::Externalize+781
 6: 00007FF797B1F61C v8::internal::Heap::EphemeronKeyWriteBarrierFromCode+1468
 7: 00007FF797B1C754 v8::internal::Heap::CollectGarbage+4244
 8: 00007FF797B1A0D0 v8::internal::Heap::AllocateExternalBackingStore+2000
 9: 00007FF797B3EA06 v8::internal::Factory::NewFillerObject+214
10: 00007FF797871CD5 v8::internal::DateCache::Weekday+1797
11: 00007FF797D1F3E1 v8::internal::SetupIsolateDelegate::SetupHeap+494417
12: 0000019F0035E20E

To Reproduce

run `npm run storybook`

System

Environment Info:

  System:
    OS: Windows 10 10.0.19045
    CPU: (8) x64 Intel(R) Core(TM) i7-7700HQ CPU @ 2.80GHz
  Binaries:
    Node: 16.13.0 - C:\Program Files\nodejs\node.EXE
    Yarn: 3.3.0 - C:\Program Files\nodejs\yarn.CMD
    npm: 9.1.2 - C:\Program Files\nodejs\npm.CMD
  Browsers:
    Edge: Spartan (44.19041.1266.0), Chromium (107.0.1418.56)
  npmPackages:
    @storybook/addon-actions: ^6.5.13 => 6.5.13
    @storybook/addon-essentials: ^6.5.13 => 6.5.13
    @storybook/addon-interactions: ^6.5.13 => 6.5.13
    @storybook/addon-links: ^6.5.13 => 6.5.13
    @storybook/angular: ^6.5.13 => 6.5.13
    @storybook/builder-webpack5: ^6.5.13 => 6.5.13
    @storybook/manager-webpack5: ^6.5.13 => 6.5.13
    @storybook/mdx2-csf: ^0.0.3 => 0.0.3
    @storybook/testing-library: 0.0.13 => 0.0.13


### Additional context

Storybook was running fine until I added some assets files and added in .storybook/main.js  `"staticDirs": ['../src/assets'],`. I removed the entry and it still gives me the same error. I added the 

I tried the following to solve the problem:

delete all node_modules folders and reinstall all packages
set the RAM usage of node in package.json to `"storybook": "npm run --max_old_space_size=16384 docs:json && start-storybook -p 6006",` and it still did not fix the problem.
@WarpRat
Copy link

WarpRat commented Nov 30, 2022 •
edited

We're hitting the same thing. It looks like it may be related to this terser-webpack-plugin. Our CI jobs always seem to fail when processing the TerserPlugin.

@JavaVista
Copy link
Author

JavaVista commented Dec 2, 2022 •
edited

Funny if I run the following command on powershell $env:NODE_OPTIONS="--max-old-space-size=8192" it works. However, now I get a new error on my Angular app for a react package.

...
[21:28:56] Get dependencies data
[21:29:50] parsing        : C:/DevDI/GIST/GIST-web-portal/src/main.ts
[21:29:50] parsing        : C:/DevDI/GIST/GIST-web-portal/src/polyfills.ts
[21:29:50] parsing        : C:/DevDI/GIST/GIST-web-portal/src/test.ts
[21:29:50] parsing        : C:/DevDI/GIST/GIST-web-portal/src/app/app-routing.module.ts
[21:29:50] Analysing routes definitions and clean them if necessary
[21:29:50] found          : AppRoutingModule
[21:29:50]                : - imports:
[21:29:50]                :     - RouterModule
[21:29:50]                : - exports:
[21:29:50]                :     - RouterModule
[21:29:50] parsing        : C:/DevDI/GIST/GIST-web-portal/src/app/app.component.ts
[21:29:50] found          : AppComponent
[21:29:50] parsing        : C:/DevDI/GIST/GIST-web-portal/src/app/app.module.ts
[21:29:50] found          : AppModule
[21:29:50]                : - imports:
[21:29:50]                :     - BrowserModule
[21:29:50]                :     - AppRoutingModule
[21:29:50]                :     - HttpClientModule
[21:29:50]                :     - BrowserAnimationsModule
[21:29:50]                : - declarations:
[21:29:50]                :     - AppComponent
[21:29:50]                : - bootstrap:
[21:29:50]                :     - AppComponent
[21:29:50] parsing        : C:/DevDI/GIST/GIST-web-portal/src/environments/.env.ts
[21:29:50] found          : env
[21:29:50] parsing        : C:/DevDI/GIST/GIST-web-portal/src/environments/environment.prod.ts
[21:29:50] found          : environment
[21:29:50] parsing        : C:/DevDI/GIST/GIST-web-portal/src/environments/environment.ts
[21:29:50] found          : environment
[21:29:50] parsing        : C:/DevDI/GIST/GIST-web-portal/src/stories/ButtonComponent.stories.ts
[21:29:50] found          : Template
[21:29:50] found          : DIButton
[21:29:50] found          : DIButton_with_Image
[21:29:50] found          : DIButtonWithAnImage
[21:29:50] parsing        : C:/DevDI/GIST/GIST-web-portal/src/stories/ExampleButton.stories.ts
[21:29:50] found          : Template
[21:29:50] found          : Primary
[21:29:50] found          : Secondary
[21:29:50] found          : Large
[21:29:50] found          : Small
[21:29:50] parsing        : C:/DevDI/GIST/GIST-web-portal/src/stories/example-button.component.ts
[21:29:50] found          : ExampleButtonComponent
[21:29:50] parsing        : C:/DevDI/GIST/GIST-web-portal/src/stories/header.component.ts
[21:29:50] found          : HeaderComponent
[21:29:50] parsing        : C:/DevDI/GIST/GIST-web-portal/src/stories/Header.stories.ts
[21:29:50] found          : Template
[21:29:50] found          : LoggedIn
[21:29:50] found          : LoggedOut
[21:29:50] parsing        : C:/DevDI/GIST/GIST-web-portal/src/stories/page.component.ts
[21:29:50] found          : PageComponent
[21:29:50] parsing        : C:/DevDI/GIST/GIST-web-portal/src/stories/Page.stories.ts
[21:29:50] found          : Template
[21:29:50] found          : LoggedOut
[21:29:50] found          : LoggedIn
[21:29:50] parsing        : C:/DevDI/GIST/GIST-web-portal/src/stories/User.ts
[21:29:50] found          : User
[21:29:50] parsing        : C:/DevDI/GIST/GIST-web-portal/src/app/@shared/index.ts
[21:29:50] parsing        : C:/DevDI/GIST/GIST-web-portal/src/app/@shared/logger.service.ts
[21:29:50] found          : LogLevel
[21:29:50] found          : LogOutput
[21:29:50] found          : Logger
[21:29:50] parsing        : C:/DevDI/GIST/GIST-web-portal/src/app/@shared/route-reusable-strategy.ts
[21:29:50] found          : RouteReusableStrategy
[21:29:50] parsing        : C:/DevDI/GIST/GIST-web-portal/src/app/@shared/shared.module.ts
[21:29:50] found          : SharedModule
[21:29:50]                : - imports:
[21:29:50]                :     - CommonModule
[21:29:50]                : - exports:
[21:29:50]                :     - LoaderComponent
[21:29:50]                : - declarations:
[21:29:50]                :     - LoaderComponent
[21:29:50] parsing        : C:/DevDI/GIST/GIST-web-portal/src/app/@shared/http/api-prefix.interceptor.ts
[21:29:51] found          : ApiPrefixInterceptor
[21:29:51] parsing        : C:/DevDI/GIST/GIST-web-portal/src/app/@shared/http/error-handler.interceptor.ts
[21:29:51] found          : log
[21:29:51] found          : ErrorHandlerInterceptor
[21:29:51] parsing        : C:/DevDI/GIST/GIST-web-portal/src/app/@shared/loader/loader.component.ts
[21:29:51] found          : LoaderComponent
[21:29:51] parsing        : C:/DevDI/GIST/GIST-web-portal/src/app/core/domain/actionPlan.ts
[21:29:51] found          : ActionPlan
[21:29:51] parsing        : C:/DevDI/GIST/GIST-web-portal/src/app/core/domain/behavior.ts
[21:29:51] found          : Behavior
[21:29:51] parsing        : C:/DevDI/GIST/GIST-web-portal/src/app/core/domain/coordinates.ts
[21:29:51] found          : Coordinates
[21:29:51] parsing        : C:/DevDI/GIST/GIST-web-portal/src/app/core/domain/discovery.ts
[21:29:51] found          : Discovery
[21:29:51] found          : DiscoveryWithTime
[21:29:51] parsing        : C:/DevDI/GIST/GIST-web-portal/src/app/core/domain/entities.ts
[21:29:51] found          : Entities
[21:29:51] found          : NewEntity
[21:29:51] parsing        : C:/DevDI/GIST/GIST-web-portal/src/app/core/domain/multipleChoice.ts
[21:29:51] found          : MultipleChoice
[21:29:51] parsing        : C:/DevDI/GIST/GIST-web-portal/src/app/core/domain/slapObject.ts
[21:29:51] found          : SlapObject
[21:29:51] parsing        : C:/DevDI/GIST/GIST-web-portal/src/app/core/domain/scenario.ts
[21:29:51] found          : Scenarios
[21:29:51] parsing        : C:/DevDI/GIST/GIST-web-portal/src/app/core/domain/videos.ts
[21:29:51] found          : Videos
[21:29:51] parsing        : C:/DevDI/GIST/GIST-web-portal/src/app/core/entities/initialUpload.ts
[21:29:51] found          : InitialUpload
[21:29:51] parsing        : C:/DevDI/GIST/GIST-web-portal/src/app/core/entities/sortByOptions.ts
[21:29:51] found          : SortByOptions
[21:29:51] parsing        : C:/DevDI/GIST/GIST-web-portal/src/app/core/entities/tags.ts
[21:29:51] found          : Tags
[21:29:51] parsing        : C:/DevDI/GIST/GIST-web-portal/src/app/core/responses/scenarioList.ts
[21:29:51] found          : ScenarioList
[21:29:51] parsing        : C:/DevDI/GIST/GIST-web-portal/src/app/core/entities/updateScenarioDetails.ts
[21:29:51] found          : UpdateScenarioDetails
[21:29:51] parsing        : C:/DevDI/GIST/GIST-web-portal/src/app/stories/stories/stories.module.ts
[21:29:51] found          : StoriesModule
[21:29:51]                : - imports:
[21:29:51]                :     - CommonModule
[21:29:51]                : - declarations:
[21:29:51]                :     - ExampleButtonComponent
[21:29:51]                :     - HeaderComponent
[21:29:51]                :     - PageComponent
[21:29:51] parsing        : C:/DevDI/GIST/GIST-web-portal/src/app/core/services/createNewScenario/createNewScenarios.service.ts
[21:29:51] found          : CreateNewScenarioService
[21:29:51] parsing        : C:/DevDI/GIST/GIST-web-portal/src/app/core/services/scenarioLibrary/scenarioLibrary.service.ts
[21:29:51] found          : ScenarioLibraryService
[21:29:51] parsing        : C:/DevDI/GIST/GIST-web-portal/src/app/gist/atoms/button/button.component.ts
[21:29:51] found          : ButtonComponent
[21:29:51] parsing        : C:/DevDI/GIST/GIST-web-portal/src/app/gist/atoms/image/image.component.ts
[21:29:51] found          : ImageComponent
[21:29:51] parsing        : C:/DevDI/GIST/GIST-web-portal/src/app/gist/molecules/header/header.component.ts
[21:29:51] found          : HeaderComponent
[21:29:51] parsing        : C:/DevDI/GIST/GIST-web-portal/src/app/gist/pages/landing/landing.component.ts
[21:29:51] found          : LandingComponent
[21:29:51] parsing        : C:/DevDI/GIST/GIST-web-portal/src/app/gist/templates/scenario-library/scenario-library.component.ts
[21:29:51] found          : ScenarioLibraryComponent
[21:29:51]                : - providers:
[21:29:51]                :     - ConfirmationService
[21:29:51] -------------------
[21:29:51] Project statistics 
[21:29:51] - files      : 461
[21:29:51] - module     : 4
[21:29:51] - component  : 10
[21:29:51] - injectable : 3
[21:29:51] - injector   : 2
[21:29:51] - class      : 17
[21:29:51] - interface  : 1
[21:29:51] - route      : 2
[21:29:51] -------------------
[21:29:51] Prepare components
[21:29:51]  AppComponent has a templateUrl, include it
[21:29:51]  AppComponent has styleUrls, include them
[21:29:51]  ButtonComponent has a templateUrl, include it
[21:29:51]  ButtonComponent has styleUrls, include them
[21:29:51]  ExampleButtonComponent has styleUrls, include them
[21:29:51]  HeaderComponent has styleUrls, include them
[21:29:51]  HeaderComponent has a templateUrl, include it
[21:29:51]  HeaderComponent has styleUrls, include them
[21:29:51]  ImageComponent has a templateUrl, include it
[21:29:51]  ImageComponent has styleUrls, include them
[21:29:51]  LandingComponent has a templateUrl, include it
[21:29:51]  LandingComponent has styleUrls, include them
[21:29:51]  LoaderComponent has a templateUrl, include it
[21:29:51]  LoaderComponent has styleUrls, include them
[21:29:51]  PageComponent has styleUrls, include them
[21:29:51]  ScenarioLibraryComponent has a templateUrl, include it
[21:29:51]  ScenarioLibraryComponent has styleUrls, include them
[21:29:51] Prepare modules
[21:29:51] Prepare injectables
[21:29:51] Prepare interceptors
[21:29:51] Process routes
[21:29:51] Prepare classes
[21:29:51] Prepare interfaces
[21:29:51] Prepare miscellaneous
[21:29:51] Process documentation coverage report
[21:29:51] Generating documentation in export format json
[21:29:51] Documentation generated in ./ in 56.588 seconds
info @storybook/angular v6.5.13
info
info => Loading presets
WARN   Failed to load preset: "C:\\DevDI\\GIST\\GIST-web-portal\\node_modules\\@storybook\\manager-webpack5\\dist\\cjs\\presets\\manager-preset.js"
ERR! Error: Cannot find module 'react/package.json'
ERR! Require stack:
ERR! - C:\DevDI\GIST\GIST-web-portal\node_modules\@storybook\ui\noop.js
ERR!     at Function.Module._resolveFilename (node:internal/modules/cjs/loader:933:15)
ERR!     at resolveFileName (C:\DevDI\GIST\GIST-web-portal\node_modules\resolve-from\index.js:29:39)
ERR!     at resolveFrom (C:\DevDI\GIST\GIST-web-portal\node_modules\resolve-from\index.js:43:9)
ERR!     at module.exports (C:\DevDI\GIST\GIST-web-portal\node_modules\resolve-from\index.js:46:47)
ERR!     at Object.<anonymous> (C:\DevDI\GIST\GIST-web-portal\node_modules\@storybook\ui\paths.js:17:18)
ERR!     at Module._compile (node:internal/modules/cjs/loader:1101:14)
ERR!     at Object.Module._extensions..js (node:internal/modules/cjs/loader:1153:10)
ERR!     at Module.load (node:internal/modules/cjs/loader:981:32)
ERR!     at Function.Module._load (node:internal/modules/cjs/loader:822:12)
ERR!     at Module.require (node:internal/modules/cjs/loader:1005:19)
ERR!  Error: Cannot find module 'react/package.json'
ERR! Require stack:
ERR! - C:\DevDI\GIST\GIST-web-portal\node_modules\@storybook\ui\noop.js
ERR!     at Function.Module._resolveFilename (node:internal/modules/cjs/loader:933:15)
ERR!     at resolveFileName (C:\DevDI\GIST\GIST-web-portal\node_modules\resolve-from\index.js:29:39)
ERR!     at resolveFrom (C:\DevDI\GIST\GIST-web-portal\node_modules\resolve-from\index.js:43:9)
ERR!     at module.exports (C:\DevDI\GIST\GIST-web-portal\node_modules\resolve-from\index.js:46:47)
ERR!     at Object.<anonymous> (C:\DevDI\GIST\GIST-web-portal\node_modules\@storybook\ui\paths.js:17:18)
ERR!     at Module._compile (node:internal/modules/cjs/loader:1101:14)
ERR!     at Object.Module._extensions..js (node:internal/modules/cjs/loader:1153:10)
ERR!     at Module.load (node:internal/modules/cjs/loader:981:32)
ERR!     at Function.Module._load (node:internal/modules/cjs/loader:822:12)
ERR!     at Module.require (node:internal/modules/cjs/loader:1005:19) {
ERR!   code: 'MODULE_NOT_FOUND',
ERR!   requireStack: [
ERR!     'C:\\DevDI\\GIST\\GIST-web-portal\\node_modules\\@storybook\\ui\\noop.js'
ERR!   ]
ERR! }
ERR! Error: Cannot find module 'react/package.json'
ERR! Require stack:
ERR! - C:\DevDI\GIST\GIST-web-portal\node_modules\@storybook\builder-webpack5\dist\cjs\preview\iframe-webpack.config.js
ERR! - C:\DevDI\GIST\GIST-web-portal\node_modules\@storybook\builder-webpack5\dist\cjs\presets\preview-preset.js
ERR! - C:\DevDI\GIST\GIST-web-portal\node_modules\@storybook\core-common\dist\cjs\presets.js
ERR! - C:\DevDI\GIST\GIST-web-portal\node_modules\@storybook\core-common\dist\cjs\index.js
ERR! - C:\DevDI\GIST\GIST-web-portal\node_modules\@storybook\core-server\dist\cjs\index.js
ERR! - C:\DevDI\GIST\GIST-web-portal\node_modules\@storybook\core\dist\cjs\server.js
ERR! - C:\DevDI\GIST\GIST-web-portal\node_modules\@storybook\core\server.js
ERR! - C:\DevDI\GIST\GIST-web-portal\node_modules\@storybook\angular\dist\ts3.9\server\index.js
ERR! - C:\DevDI\GIST\GIST-web-portal\node_modules\@storybook\angular\bin\index.js
ERR!     at Function.Module._resolveFilename (node:internal/modules/cjs/loader:933:15)
ERR!     at Function.resolve (node:internal/modules/cjs/helpers:108:19)
ERR!     at _default (C:\DevDI\GIST\GIST-web-portal\node_modules\@storybook\builder-webpack5\dist\cjs\preview\iframe-webpack.config.js:202:46) 
ERR!     at async starterGeneratorFn (C:\DevDI\GIST\GIST-web-portal\node_modules\@storybook\builder-webpack5\dist\cjs\index.js:116:16)
ERR!     at async Object.start (C:\DevDI\GIST\GIST-web-portal\node_modules\@storybook\builder-webpack5\dist\cjs\index.js:272:14)
ERR!     at async Promise.all (index 0)
ERR!     at async storybookDevServer (C:\DevDI\GIST\GIST-web-portal\node_modules\@storybook\core-server\dist\cjs\dev-server.js:203:28)
ERR!     at async buildDevStandalone (C:\DevDI\GIST\GIST-web-portal\node_modules\@storybook\core-server\dist\cjs\build-dev.js:120:31)
ERR!     at async Object.buildDev (C:\DevDI\GIST\GIST-web-portal\node_modules\@storybook\core-server\dist\cjs\build-dev.js:174:5)
ERR!  Error: Cannot find module 'react/package.json'
ERR! Require stack:
ERR! - C:\DevDI\GIST\GIST-web-portal\node_modules\@storybook\builder-webpack5\dist\cjs\preview\iframe-webpack.config.js
ERR! - C:\DevDI\GIST\GIST-web-portal\node_modules\@storybook\builder-webpack5\dist\cjs\presets\preview-preset.js
ERR! - C:\DevDI\GIST\GIST-web-portal\node_modules\@storybook\core-common\dist\cjs\presets.js
ERR! - C:\DevDI\GIST\GIST-web-portal\node_modules\@storybook\core-common\dist\cjs\index.js
ERR! - C:\DevDI\GIST\GIST-web-portal\node_modules\@storybook\core-server\dist\cjs\index.js
ERR! - C:\DevDI\GIST\GIST-web-portal\node_modules\@storybook\core\dist\cjs\server.js
ERR! - C:\DevDI\GIST\GIST-web-portal\node_modules\@storybook\core\server.js
ERR! - C:\DevDI\GIST\GIST-web-portal\node_modules\@storybook\angular\dist\ts3.9\server\index.js
ERR! - C:\DevDI\GIST\GIST-web-portal\node_modules\@storybook\angular\bin\index.js
ERR!     at Function.Module._resolveFilename (node:internal/modules/cjs/loader:933:15)
ERR!     at Function.resolve (node:internal/modules/cjs/helpers:108:19)
ERR!     at _default (C:\DevDI\GIST\GIST-web-portal\node_modules\@storybook\builder-webpack5\dist\cjs\preview\iframe-webpack.config.js:202:46) 
ERR!     at async starterGeneratorFn (C:\DevDI\GIST\GIST-web-portal\node_modules\@storybook\builder-webpack5\dist\cjs\index.js:116:16)
ERR!     at async Object.start (C:\DevDI\GIST\GIST-web-portal\node_modules\@storybook\builder-webpack5\dist\cjs\index.js:272:14)
ERR!     at async Promise.all (index 0)
ERR!     at async storybookDevServer (C:\DevDI\GIST\GIST-web-portal\node_modules\@storybook\core-server\dist\cjs\dev-server.js:203:28)
ERR!     at async buildDevStandalone (C:\DevDI\GIST\GIST-web-portal\node_modules\@storybook\core-server\dist\cjs\build-dev.js:120:31)
ERR!     at async Object.buildDev (C:\DevDI\GIST\GIST-web-portal\node_modules\@storybook\core-server\dist\cjs\build-dev.js:174:5) {
ERR!   code: 'MODULE_NOT_FOUND',
ERR!   requireStack: [
ERR!     'C:\\DevDI\\GIST\\GIST-web-portal\\node_modules\\@storybook\\builder-webpack5\\dist\\cjs\\preview\\iframe-webpack.config.js',
ERR!     'C:\\DevDI\\GIST\\GIST-web-portal\\node_modules\\@storybook\\builder-webpack5\\dist\\cjs\\presets\\preview-preset.js',
ERR!     'C:\\DevDI\\GIST\\GIST-web-portal\\node_modules\\@storybook\\core-common\\dist\\cjs\\presets.js',
ERR!     'C:\\DevDI\\GIST\\GIST-web-portal\\node_modules\\@storybook\\core-common\\dist\\cjs\\index.js',
ERR!     'C:\\DevDI\\GIST\\GIST-web-portal\\node_modules\\@storybook\\core-server\\dist\\cjs\\index.js',
ERR!     'C:\\DevDI\\GIST\\GIST-web-portal\\node_modules\\@storybook\\core\\dist\\cjs\\server.js',
ERR!     'C:\\DevDI\\GIST\\GIST-web-portal\\node_modules\\@storybook\\core\\server.js',
ERR!     'C:\\DevDI\\GIST\\GIST-web-portal\\node_modules\\@storybook\\angular\\dist\\ts3.9\\server\\index.js',
ERR!     'C:\\DevDI\\GIST\\GIST-web-portal\\node_modules\\@storybook\\angular\\bin\\index.js'
ERR!   ]
ERR! }

WARN Broken build, fix the error above.
WARN You may need to refresh the browser.

info => Loading presets

@JavaVista
Copy link
Author

JavaVista commented Dec 4, 2022 •
edited

So, I did the following to fix that weird error of a missing react package on my Angular project:

  • deleted all storybook related dependencies from package.json
  • ran npm to update the lockfile
  • ran npm run storybook
    Got the same memory error:
[20:33:40] Get dependencies data

<--- Last few GCs --->

[19652:00000215A69F5CA0]    45145 ms: Scavenge 4041.0 (4115.4) -> 4040.7 (4125.7) MB, 10.4 / 0.0 ms  (average mu = 0.452, current mu = 0.314) allocation failure;
[19652:00000215A69F5CA0]    45193 ms: Scavenge 4047.6 (4125.7) -> 4047.0 (4126.4) MB, 12.4 / 0.0 ms  (average mu = 0.452, current mu = 0.314) allocation failure;
[19652:00000215A69F5CA0]    46845 ms: Scavenge 4048.4 (4126.4) -> 4047.6 (4147.9) MB, 1644.4 / 0.0 ms  (average mu = 0.452, current mu = 0.314) allocation failure;


<--- JS stacktrace --->

FATAL ERROR: Reached heap limit Allocation failed - JavaScript heap out of memory
 1: 00007FF7AC321B7F node_api_throw_syntax_error+203775
 2: 00007FF7AC2A1556 v8::internal::wasm::WasmCode::safepoint_table_offset+63558
 3: 00007FF7AC2A28C2 v8::internal::wasm::WasmCode::safepoint_table_offset+68530
 4: 00007FF7ACD447F4 v8::Isolate::ReportExternalAllocationLimitReached+116
 5: 00007FF7ACD2FB52 v8::Isolate::Exit+674
 6: 00007FF7ACBB1BBC v8::internal::EmbedderStackStateScope::ExplicitScopeForTesting+124
 7: 00007FF7ACBAEDDB v8::internal::Heap::CollectGarbage+3963
 8: 00007FF7ACBC5013 v8::internal::HeapAllocator::AllocateRawWithLightRetrySlowPath+2099
 9: 00007FF7ACBC58BD v8::internal::HeapAllocator::AllocateRawWithRetryOrFailSlowPath+93
10: 00007FF7ACBD50F3 v8::internal::Factory::NewFillerObject+851
11: 00007FF7AC8C6825 v8::internal::DateCache::Weekday+1349
12: 00007FF7ACDE1E81 v8::internal::SetupIsolateDelegate::SetupHeap+558193
13: 00007FF7ACD67992 v8::internal::SetupIsolateDelegate::SetupHeap+57218
14: 00007FF72D1C7064
  • ran in powershell $env:NODE_OPTIONS="--max-old-space-size=8192"

Story loaded fine. I assume there is a memory leak in Storybook. How will I declare this :NODE_OPTIONS in my Angular package.json so I don't have to type it all the time?

Here is my package.json :

{
  "name": "gist-web-portal",
  "version": "1.0.0",
  "scripts": {
    "ng": "ng",
    "start": "npm run write:env -s && ng serve -o --proxy-config proxy.conf.js",
    "build": "npm run write:env -s && ng build",
    "watch": "ng build --watch --configuration development",
    "test": "npm run write:env -s && ng test",
    "write:env": "ngx-scripts env npm_package_version",
    "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/animations": "^15.0.0",
    "@angular/common": "^15.0.0",
    "@angular/compiler": "^15.0.0",
    "@angular/core": "^15.0.0",
    "@angular/forms": "^15.0.0",
    "@angular/platform-browser": "^15.0.0",
    "@angular/platform-browser-dynamic": "^15.0.0",
    "@angular/router": "^15.0.0",
    "@ngx-rocket/scripts": "^5.2.2",
    "primeicons": "^6.0.1",
    "primeng": "^15.0.0-rc.1",
    "rxjs": "~7.5.0",
    "tslib": "^2.3.0",
    "zone.js": "~0.11.4"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "^15.0.0",
    "@angular/cli": "~15.0.0",
    "@angular/compiler-cli": "^15.0.0",
    "@babel/core": "^7.20.5",
    "@compodoc/compodoc": "^1.1.19",
    "@storybook/addon-actions": "^6.5.14",
    "@storybook/addon-essentials": "^6.5.14",
    "@storybook/addon-interactions": "^6.5.14",
    "@storybook/addon-links": "^6.5.14",
    "@storybook/angular": "^6.5.14",
    "@storybook/builder-webpack5": "^6.5.14",
    "@storybook/manager-webpack5": "^6.5.14",
    "@storybook/testing-library": "^0.0.13",
    "@types/jasmine": "~4.0.0",
    "babel-loader": "^8.3.0",
    "https-proxy-agent": "^5.0.1",
    "jasmine-core": "~4.3.0",
    "karma": "~6.4.0",
    "karma-chrome-launcher": "~3.1.0",
    "karma-coverage": "~2.2.0",
    "karma-jasmine": "~5.1.0",
    "karma-jasmine-html-reporter": "~2.0.0",
    "typescript": "~4.8.4"
  }
}

@ndelangen ndelangen mentioned this issue May 30, 2023
Merged
@dimafirsov
Copy link

Please also refer to this issue:
#6408

@ndelangen suggestion helped to resolve the issue.

@ndelangen
Copy link
Member

@JavaVista Could you create a minimal repro of this:

Additional context

Storybook was running fine until I added some assets files and added in .storybook/main.js "staticDirs": ['../src/assets'],. I removed the entry and it still gives me the same error. I added the

I'd definitely take a look if this caused a problem indeed.

You mention this happens to you when you run storybook dev, which means this code runs:

storybook/code/lib/core-server/src/utils/server-statics.ts

Lines 14 to 62 in 03b1e95

export async function useStatics(router: any, options: Options) {
const staticDirs = await options.presets.apply<StorybookConfig['staticDirs']>('staticDirs');
const faviconPath = await options.presets.apply<string>('favicon');
if (options.staticDir && !isEqual(staticDirs, defaultStaticDirs)) {
throw new Error(dedent`
Conflict when trying to read staticDirs:
* Storybook's configuration option: 'staticDirs'
* Storybook's CLI flag: '--staticDir' or '-s'
Choose one of them, but not both.
`);
}
const statics = [
...staticDirs.map((dir) => (typeof dir === 'string' ? dir : `${dir.from}:${dir.to}`)),
...(options.staticDir || []),
];
if (statics && statics.length > 0) {
await Promise.all(
statics.map(async (dir) => {
try {
const relativeDir = staticDirs
? getDirectoryFromWorkingDir({
configDir: options.configDir,
workingDir: process.cwd(),
directory: dir,
})
: dir;
const { staticDir, staticPath, targetEndpoint } = await parseStaticDir(relativeDir);
// Don't log for the internal static dir
if (!targetEndpoint.startsWith('/sb-')) {
logger.info(
chalk`=> Serving static files from {cyan ${staticDir}} at {cyan ${targetEndpoint}}`
);
}
router.use(targetEndpoint, express.static(staticPath, { index: false }));
} catch (e) {
logger.warn(e.message);
}
})
);
}
router.use(favicon(faviconPath));
}

I don't see what the memory leak here could be, it's not actually loading the files into memory at all AFAICS

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
bug needs triage
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
4 participants
@ndelangen @JavaVista @dimafirsov @WarpRat