javascript - Gatsby 构建图像时 Node JS 崩溃

Question

当我运行 gatsby develop 时，它工作正常，但是当我运行 gatsby build 时，node js 崩溃并出现此错误:

    [==                          ]   46.026 s 69/896 8% Generating image thumbnails

<--- Last few GCs --->

[38861:0x102802000]    75001 ms: Scavenge 1286.0 (1422.9) -> 1285.5 (1423.4) MB, 4.1 / 0.0 ms  (average mu = 0.087, current mu = 0.045) allocation failure 
[38861:0x102802000]    75007 ms: Scavenge 1286.2 (1423.4) -> 1285.8 (1423.9) MB, 4.0 / 0.0 ms  (average mu = 0.087, current mu = 0.045) allocation failure 
[38861:0x102802000]    75012 ms: Scavenge 1286.5 (1423.9) -> 1286.0 (1424.4) MB, 4.0 / 0.0 ms  (average mu = 0.087, current mu = 0.045) allocation failure 


<--- JS stacktrace --->

==== JS stack trace =========================================

    0: ExitFrame [pc: 0x222bc6edbe3d]
    1: StubFrame [pc: 0x222bc6edd3c6]
Security context: 0x39162a79e6e9 <JSObject>
    2: SourceMapGenerator_serializeMappings [0x3916d3cfa859] [/Library/WebServer/Documents/website.com/node_modules/source-map/lib/source-map-generator.js:~303] [pc=0x222bc7ff6c5c](this=0x3916dcf82
201 <SourceMapGenerator map = 0x39164e1fdda9>)
    3: SourceMapGenerator_toJSON [0x3916d3cfa8d9] [/Library/WebServer/...

FATAL ERROR: Ineffective mark-compacts near heap limit Allocation failed - JavaScript heap out of memory
 1: 0x10003cf99 node::Abort() [/usr/local/bin/node]
 2: 0x10003d1a3 node::OnFatalError(char const*, char const*) [/usr/local/bin/node]
 3: 0x1001b7835 v8::internal::V8::FatalProcessOutOfMemory(v8::internal::Isolate*, char const*, bool) [/usr/local/bin/node]
 4: 0x100585682 v8::internal::Heap::FatalProcessOutOfMemory(char const*) [/usr/local/bin/node]
 5: 0x100588155 v8::internal::Heap::CheckIneffectiveMarkCompact(unsigned long, double) [/usr/local/bin/node]
 6: 0x100583fff v8::internal::Heap::PerformGarbageCollection(v8::internal::GarbageCollector, v8::GCCallbackFlags) [/usr/local/bin/node]
 7: 0x1005821d4 v8::internal::Heap::CollectGarbage(v8::internal::AllocationSpace, v8::internal::GarbageCollectionReason, v8::GCCallbackFlags) [/usr/local/bin/node]
 8: 0x10058ea6c v8::internal::Heap::AllocateRawWithLigthRetry(int, v8::internal::AllocationSpace, v8::internal::AllocationAlignment) [/usr/local/bin/node]
 9: 0x10058eaef v8::internal::Heap::AllocateRawWithRetryOrFail(int, v8::internal::AllocationSpace, v8::internal::AllocationAlignment) [/usr/local/bin/node]
10: 0x10055e434 v8::internal::Factory::NewFillerObject(int, bool, v8::internal::AllocationSpace) [/usr/local/bin/node]
11: 0x1007e6714 v8::internal::Runtime_AllocateInNewSpace(int, v8::internal::Object**, v8::internal::Isolate*) [/usr/local/bin/node]
12: 0x222bc6edbe3d 
13: 0x222bc6edd3c6 
Abort trap: 6

我有很多来自 wordpress 的图片，它们在帖子中，所以我将上传文件夹移动到 static/img/uploads 就像这样帖子中的所有图片都工作正常，但现在我无法构建和它崩溃了，也在 netlify 上。

这就是我在 gatsby-config.js

中的内容

{
      // keep as first gatsby-source-filesystem plugin for gatsby image support
      resolve: 'gatsby-source-filesystem',
      options: {
        path: `${__dirname}/static/img`,
        name: 'uploads'
      }
    },

还有这个

{
      resolve: 'gatsby-transformer-remark',
      options: {
        plugins: [
          {
            resolve: 'gatsby-remark-relative-images',
            options: {
              name: 'uploads'
            }
          },
          {
            resolve: 'gatsby-remark-images',
            options: {
              // It's important to specify the maxWidth (in pixels) of
              // the content container as this plugin uses this as the
              // base for generating different widths of each image.
              maxWidth: 700,
              linkImagesToOriginal: false
            }
          },
          `gatsby-remark-images-medium-zoom`,
          {
            resolve: 'gatsby-remark-copy-linked-files',
            options: {
              destinationDir: 'static'
            }
          }
        ]
      }
    },

在它开始工作之前，我清理了文件夹以删除未使用的图像，但现在我无法再构建了……有没有更好的方法从 wordpress 导入图像？ (我不想从 wp 获取资源，因为我只想使用 Gatsby 并删除所有 wp 文件)

谢谢

Answer 1

您的项目有大量内存(典型的 WordPress 问题，因为他们的服务器响应通常高于其他项目)。

如图所示，gatsby-source-filesystem的文档Gatsby 对并发下载添加了限制，以防止 processRemoteNode 过载。为了修复和修改任何自定义配置，他们公开了一个 GATSBY_CONCURRENT_DOWNLOAD 环境变量:

To prevent concurrent requests overload of processRemoteNode, you can adjust the 200 default concurrent downloads, with GATSBY_CONCURRENT_DOWNLOAD environment variable.

在您的运行命令中，设置解决您的问题的值。在我的例子中，它是 5:

"develop": "GATSBY_CONCURRENT_DOWNLOAD=5 gatsby develop"