提问者:小点点

在Visual Studio中发布时出现react/Node“JavaScript堆内存不足”错误


我知道这个问题已经提出过很多次了,所以请耐心等待。npm 构建运行不断失败,并出现“JavaScript 堆内存不足”错误。我尝试使用环境变量和命令行参数 --max-old-space-size=8000 设置节点堆大小。我也尝试了这个不推荐使用的 npm 包

  • 我在Visual Studio中有一个带有.Net Core 3.1(无Redux)的ReactJS 17应用程序
  • 我可以从Visual Studio本地运行该应用程序,没有任何问题。
  • 我尝试通过删除 package-lock.json、删除 npm_modules 文件夹并运行 npm 缓存清理 --force 然后安装 npm 来清除 npm 缓存
  • 我还将 Node 更新到最新版本

当我从 Visual Studio (2019 企业版) 中发布应用或从命令行执行“npm run build”时,会出现此问题。(VS 发布执行 npm 运行构建,因此结果相同)发布输出日志以这样的方式结束

...
...
npm notice
npm notice New patch version of npm available! 8.1.0 -> 8.1.2
npm notice Changelog: <https://github.com/npm/cli/releases/tag/v8.1.2>
npm notice Run `npm install -g npm@8.1.2` to update!
npm notice
npm run build --max-old-space-size=8000

> aptivdataviz.ui@0.1.0 build
> react-scripts build

Creating an optimized production build...

<--- Last few GCs --->

[25772:000001DF72B19920] 116426 ms: Mark-sweep (reduce) 2045.5 (2082.4) -> 2045.0 (2082.9) MB, 1337.8 / 0.1 ms (+ 87.0 ms in 21 steps since start of marking, biggest step 8.4 ms, walltime since start of marking 1439 ms) (average mu = 0.482, current mu [25772:000001DF72B19920] 118013 ms: Mark-sweep (reduce) 2046.1 (2082.9) -> 2045.8 (2083.6) MB, 1584.9 / 0.1 ms (average mu = 0.306, current mu = 0.001) allocation failure scavenge might not succeed


<--- JS stacktrace --->

EXEC(0,0): Error : Reached heap limit Allocation failed - JavaScript heap out of memory
1: 00007FF7AF3A013F v8::internal::CodeObjectRegistry::~CodeObjectRegistry+112495
2: 00007FF7AF32F396 DSA_meth_get_flags+65526
3: 00007FF7AF33024D node::OnFatalError+301
4: 00007FF7AFC619EE v8::Isolate::ReportExternalAllocationLimitReached+94
5: 00007FF7AFC4BECD v8::SharedArrayBuffer::Externalize+781
6: 00007FF7AFAEF61C v8::internal::Heap::EphemeronKeyWriteBarrierFromCode+1468
7: 00007FF7AFAEC754 v8::internal::Heap::CollectGarbage+4244
8: 00007FF7AFAEA0D0 v8::internal::Heap::AllocateExternalBackingStore+2000
9: 00007FF7AFB0EA06 v8::internal::Factory::NewFillerObject+214
10: 00007FF7AF841CD5 v8::internal::DateCache::Weekday+1797
11: 00007FF7AFCEF3E1 v8::internal::SetupIsolateDelegate::SetupHeap+494417
12: 00007FF7AFCAB44B v8::internal::SetupIsolateDelegate::SetupHeap+215995
13: 000001DF74924705
C:\Dev\.....\Foo.UI.csproj(171,5): Error MSB3073: The command "npm run build --max-old-space-size=8000" exited with code -1.
Done building project "Foo.UI.csproj" -- FAILED.

您会注意到末尾的“ --max-old-space-size=8000”。我尝试将其添加到我的csproj文件中,但这没有效果:

  <Target Name="PublishRunWebpack" AfterTargets="ComputeFilesToPublish">
    <!-- As part of publishing, ensure the JS resources are freshly built in production mode -->
    <Exec WorkingDirectory="$(SpaRoot)" Command="npm install --max-old-space-size=8000" />
    <Exec WorkingDirectory="$(SpaRoot)" Command="npm run build --max-old-space-size=8000" />

    <!-- Include the newly-built files in the publish output -->
    <ItemGroup>
      <DistFiles Include="$(SpaRoot)build\**; $(SpaRoot)build-ssr\**" />
      <ResolvedFileToPublish Include="@(DistFiles->'%(FullPath)')" Exclude="@(ResolvedFileToPublish)">
        <RelativePath>%(DistFiles.Identity)</RelativePath>
        <CopyToPublishDirectory>PreserveNewest</CopyToPublishDirectory>
        <ExcludeFromSingleFile>true</ExcludeFromSingleFile>
      </ResolvedFileToPublish>
    </ItemGroup>
  </Target>

这是“npm run build”的输出(带和不带 --max-old-space-size 参数)PS C:\Dev...\Foo.UI\ClientApp

> aptivdataviz.ui@0.1.0 build
> react-scripts build

Creating an optimized production build...

<--- Last few GCs --->

[3440:000002CDAA96ADB0]   111440 ms: Mark-sweep (reduce) 2045.6 (2082.6) -> 2045.0 (2083.1) MB, 1629.6 / 0.1 ms  (average mu = 0.452, current mu = 0.005) allocation failure scavenge might not succeed
[3440:000002CDAA96ADB0]   113522 ms: Mark-sweep (reduce) 2046.1 (2083.1) -> 2045.7 (2083.9) MB, 2079.8 / 0.1 ms  (average mu = 0.260, current mu = 0.001) allocation failure scavenge might not succeed


<--- JS stacktrace --->

FATAL ERROR: Reached heap limit Allocation failed - JavaScript heap out of memory
 1: 00007FF63704013F v8::internal::CodeObjectRegistry::~CodeObjectRegistry+112495
 2: 00007FF636FCF396 DSA_meth_get_flags+65526
 3: 00007FF636FD024D node::OnFatalError+301
 4: 00007FF6379019EE v8::Isolate::ReportExternalAllocationLimitReached+94
 5: 00007FF6378EBECD v8::SharedArrayBuffer::Externalize+781
 6: 00007FF63778F61C v8::internal::Heap::EphemeronKeyWriteBarrierFromCode+1468
 7: 00007FF63778C754 v8::internal::Heap::CollectGarbage+4244
 8: 00007FF63778A0D0 v8::internal::Heap::AllocateExternalBackingStore+2000
 9: 00007FF6377AEA06 v8::internal::Factory::NewFillerObject+214
10: 00007FF6374E1CD5 v8::internal::DateCache::Weekday+1797
11: 00007FF63798F3E1 v8::internal::SetupIsolateDelegate::SetupHeap+494417
12: 000002CDACB7E30F
PS C:\Dev\...\Foo.UI\ClientApp>

我猜我增加堆大小的尝试由于某种原因无效/错误,或者是其他事情以这种方式表现出来。

为什么VS会成功运行应用程序,但没有这个问题就不能发布它?

更新我尝试更新我的 package.json 文件以包含最大旧空间大小参数

  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts --max_old_space_size=4096 build",
    "test": "cross-env CI=true react-scripts test --env=jsdom",
    "eject": "react-scripts eject",
    "lint": "eslint ./src/**/*.ts ./src/**/*.tsx"
  },

当我npm run build时,我得到以下信息

> aptivdataviz.ui@0.1.0 build
> react-scripts --max_old_space_size=4096 build

Creating an optimized production build...

<--- Last few GCs --->

提前感谢!


共1个答案

匿名用户

好吧,在分支我的项目并逐个剥离它,并每次运行 npm run build 之后,它最终是语法错误,表现为内存堆错误。

我达到了npm run build成功运行的地步,所以我开始一个接一个地重新添加我的组件。我有很多语法错误,我一个接一个地解决了。

有些人甚至将一个字符串变量赋给一个不是字符串的对象。

然后发生了,恢复其中一个组件后出现堆错误。这也是语法错误!不是内存问题!

我确实觉得奇怪的是,这些问题只在npm-run-build上出现,而不是在VisualStudio中按F5时出现。另一个令人讨厌的问题是,当您执行npm运行build时,它一次只会引发一个问题,而不是列出您可以一次性解决的所有问题。