Looks like adding font families doenst work in Nuxt 3.8.0 and Netlify

[roccojanse]

This config in the Nuxt config file triggers an javascript heap error during a Netlify build:

googleFonts: { preconnect: true, preload: true, families: { 'Nunito+Sans': { wght: [300, 400, 600, 700], ital: [300, 400, 600, 700], }, }, },

Without added families everything is OK, but it errors when actual families are added. Also tried families from the docs to be sure it wasnt the perticular family whcih has issues.

Nuxt 3.8.0 and Google Fonts module 3.0.2.

Any ideas?

Netlify Error log:

12:45:42 PM: Packaging Functions from .netlify/functions-internal directory:
12:45:42 PM: - server/server.mjs
12:45:42 PM: ​
12:46:01 PM: <--- Last few GCs --->
12:46:01 PM: [3819:0x72af220] 33696 ms: Scavenge 2023.9 (2058.4) -> 2023.9 (2063.7) MB, 3.3 / 0.0 ms (average mu = 0.133, current mu = 0.092) allocation failure;
12:46:01 PM: [3819:0x72af220] 33702 ms: Scavenge 2026.7 (2063.7) -> 2026.9 (2064.4) MB, 4.7 / 0.0 ms (average mu = 0.133, current mu = 0.092) allocation failure;
12:46:01 PM: [3819:0x72af220] 33708 ms: Scavenge 2027.7 (2064.4) -> 2027.5 (2075.7) MB, 6.1 / 0.0 ms (average mu = 0.133, current mu = 0.092) allocation failure;
12:46:01 PM: <--- JS stacktrace --->
12:46:01 PM: FATAL ERROR: Ineffective mark-compacts near heap limit Allocation failed - JavaScript heap out of memory
12:46:01 PM: 1: 0xb85bc0 node::Abort() [/opt/buildhome/node-deps/node]
12:46:01 PM: 2: 0xa94834 [/opt/buildhome/node-deps/node]
12:46:01 PM: 3: 0xd66d10 v8::Utils::ReportOOMFailure(v8::internal::Isolate*, char const*, bool) [/opt/buildhome/node-deps/node]
12:46:01 PM: 4: 0xd670b7 v8::internal::V8::FatalProcessOutOfMemory(v8::internal::Isolate*, char const*, bool) [/opt/buildhome/node-deps/node]
12:46:01 PM: 5: 0xf447c5 [/opt/buildhome/node-deps/node]
12:46:01 PM: 6: 0xf456c8 v8::internal::Heap::RecomputeLimits(v8::internal::GarbageCollector) [/opt/buildhome/node-deps/node]
12:46:01 PM: 7: 0xf55bd3 [/opt/buildhome/node-deps/node]
12:46:01 PM: 8: 0xf56a48 v8::internal::Heap::CollectGarbage(v8::internal::AllocationSpace, v8::internal::GarbageCollectionReason, v8::GCCallbackFlags) [/opt/buildhome/node-deps/node]
12:46:01 PM: 9: 0xf313ae v8::internal::HeapAllocator::AllocateRawWithLightRetrySlowPath(int, v8::internal::AllocationType, v8::internal::AllocationOrigin, v8::internal::AllocationAlignment) [/opt/buildhome/node-deps/node]
12:46:01 PM: 10: 0xf32777 v8::internal::HeapAllocator::AllocateRawWithRetryOrFailSlowPath(int, v8::internal::AllocationType, v8::internal::AllocationOrigin, v8::internal::AllocationAlignment) [/opt/buildhome/node-deps/node]
12:46:01 PM: 11: 0xf1394a v8::internal::Factory::NewFillerObject(int, v8::internal::AllocationAlignment, v8::internal::AllocationType, v8::internal::AllocationOrigin) [/opt/buildhome/node-deps/node]
12:46:01 PM: 12: 0x12d8caf v8::internal::Runtime_AllocateInYoungGeneration(int, unsigned long*, v8::internal::Isolate*) [/opt/buildhome/node-deps/node]
12:46:01 PM: 13: 0x1705b39 [/opt/buildhome/node-deps/node]
12:46:03 PM: Failed during stage "building site": Build script returned non-zero exit code: 134
12:46:03 PM: /opt/build-bin/build: line 132: 3819 Aborted (core dumped) FORCE_COLOR=1 "$netlify_build_node_bin" "$netlify_build_bin" --cwd="$repository_root" --repositoryRoot="$repository_root" --packagePath="$package_path" --config="$configuration_file_path" --branch="$branch" --siteId="$site_id" --defaultConfig="$default_config" --baseRelDir="$base_rel_dir" --context="$context" --node-path="$user_node_path" --cachedConfigPath="$cached_netlify_build_config_file" --api-host="$netlify_endpoint" --token="$netlify_token" --build-id="$BUILD_ID" --deploy-id="$DEPLOY_ID" --mode="buildbot" --telemetry="$build_telemetry" --send-status --save-config --statsd.host="$HOST_NODE_IP" --statsd.port="$STATSD_PORT" --tracing.enabled="$tracing_enabled" --tracing.sampleRate="$tracing_sample_rate" --tracing.host="$HOST_NODE_IP" --tracing.traceId="$trace_id" --tracing.parentSpanId="$parent_span_id" --tracing.traceFlags="$trace_flags" --tracing.baggageFilePath="$tracing_baggage_file_path" --functions-dist-dir="$functions_dist_dir" --edge-functions-dist-dir="$edge_functions_dist_dir" --cache-dir="$cache_dir" --buildbot-server-socket="$buildbot_server_socket" --framework="$framework" --feature-flags="$feature_flags" --testOpts.silentLingeringProcesses="$SILENT_LINGERING_PROCESSES" --system-log-file="$system_log_file" --explicit-secret-keys="$explicit_secret_keys"
12:46:03 PM: Error running command: Build script returned non-zero exit code: 134
12:46:03 PM: Failing build: Failed to build site
12:46:03 PM: Finished processing build request in 53.399s

[TheHugoBoss]

Have the same issue
Spent 2 days trying to track down why netlify wont build the app

My config is as follows:

  googleFonts: {
      families: {
        Roboto: {
          wght: [100, 400, 700],
        },
      }
  },

Edit, for now this works:

  googleFonts: {
    families: {
      Roboto: true,
    }
},

[roccojanse]

@TheHugoBoss thanks, tried that as well, unfortunately, didnt seem to work in my particular case.

[cfab]

same here

[kristianthrane]

Yeah - had to remove the module too - after 2 days of frustration 😆

[ricardogobbosouza]

@danielroe any idea?
From what I understand, this occurs when we have more than 10 fonts to be downloaded

[roccojanse]

@ricardogobbosouza in my case it actually doesnt matter how many fonts need to be downloaded. If I add a family, doesnt matter which one, it triggers the javascript heap errors (on Netlify).

[ricardogobbosouza]

@roccojanse
add this to your nuxt.config, temporarily

postcss: {
  plugins: {
    tailwindcss: {},
    autoprefixer: {},
    cssnano:
      process.env.NODE_ENV === 'production'
       ? { preset: ['default', { discardComments: { removeAll: true } }] }
          : false, // disable cssnano when not in production
   },
}

[danielroe]

@ricardogobbosouza Interesting. Do you think this is a cssnano bug then?

[ricardogobbosouza]

@ricardogobbosouza Interesting. Do you think this is a cssnano bug then?

https://answers.netlify.com/t/javascript-heap-out-of-memory-when-trying-to-build-a-nuxt-app/93138/13

[ricardogobbosouza]

@danielroe
I believe it is a problem with the discardComments plugin

[ricardogobbosouza]

problem no longer occurs