nuxt: The argument 'hints' must be an array or string of format - after upgrading to rc12 - worked on rc11
Environment
------------------------------
- Operating System: `Darwin`
- Node Version: `v18.11.0`
- Nuxt Version: `3.0.0-rc.12`
- Nitro Version: `0.6.0`
- Package Manager: `npm@8.19.2`
- Builder: `vite`
- User Config: `build`, `buildModules`, `modules`, `publicRuntimeConfig`, `privateRuntimeConfig`, `globalName`, `app`, `intlify`, `http`, `proxy`, `auth`, `tailwindcss`, `googleFonts`
- Runtime Modules: `@nuxtjs-alt/auth@2.0.20`, `@nuxtjs-alt/http@1.3.18`, `@nuxtjs-alt/proxy@1.3.5`, `@nuxt/content@2.1.1`, `@nuxtjs/tailwindcss@5.3.5`, `@nuxtjs/google-fonts@3.0.0-0`, `@intlify/nuxt3@0.2.4`, `@pinia/nuxt@0.4.3`
- Build Modules: `@intlify/nuxt3@0.2.4`
------------------------------
Reproduction
Upgrade to nuxt3-rc12 and start app in prod mode (npm run build && npm run start
). Error does not appear in dev mode.
Describe the bug
I am getting the following error after upgrading from rc11 to rc12:
The argument 'hints' must be an array or string of format "</styles.css>; rel=preload; as=style". Received '</_application/IBM_Plex_Mono-100-1.52f24bb1.woff2>; rel="prefetch"; as="font"; type="font/woff2"'
Console shows:
Listening http://[::]:3000
[nuxt] [request error] [unhandled] [500] The argument 'hints' must be an array or string of format "</styles.css>; rel=preload; as=style". Received '</_application/IBM_Plex_Mono-100-1.52f24bb1.woff2>; rel="prefetch"; as="font"; type="font/woff2"'
at new NodeError (node:internal/errors:393:5)
at validateLinkHeaderFormat (node:internal/validators:455:11)
at validateLinkHeaderValue (node:internal/validators:481:7)
at ServerResponse.writeEarlyHints (node:_http_server:314:16)
at writeEarlyHints (./.output/server/node_modules/h3/dist/index.mjs:303:22)
at ./.output/server/chunks/handlers/renderer.mjs:402:5
at async ./.output/server/chunks/handlers/renderer.mjs:59:22
at async Object.handler (./.output/server/node_modules/h3/dist/index.mjs:566:19)
at async Server.toNodeHandle (./.output/server/node_modules/h3/dist/index.mjs:630:7)
Additional context
nuxt.config.js
import {defineNuxtConfig} from 'nuxt'
export default defineNuxtConfig({
build: {
transpile: ['@heroicons/vue', /echarts/, 'resize-detector', 'reflect-metadata', '@headlessui/vue', 'vue-toastification'],
},
buildModules: ['@intlify/nuxt3',],
modules: [
'@nuxtjs-alt/auth',
'@nuxtjs-alt/http',
'@nuxtjs-alt/proxy',
'@nuxt/content',
'@nuxtjs/tailwindcss',
'@nuxtjs/google-fonts',
'@intlify/nuxt3',
'@pinia/nuxt',
],
app: {
buildAssetsDir: '/_application/',
head: {
meta: [{
name: 'viewport',
content: 'width=device-width,height=device-height,initial-scale=1,maximum-scale=1,shrink-to-fit=no'
}],
script: [],
htmlAttrs: {
class: 'h-full'
},
bodyAttrs: {
class: 'h-full',
},
}
},
googleFonts: {
download: true,
display: 'auto',
families: {
Lato: [100, 300, 500],
'IBM Plex Mono': [100, 300, 500],
},
},
});
Works fine, if I don’t use the google fonts module. But well - in this case my font’s are not loaded correctly 😉
Logs
No response
About this issue
- Original URL
- State: closed
- Created 2 years ago
- Reactions: 2
- Comments: 19 (9 by maintainers)
This will be resolved with Node 19.1.0
Hi,
using
solves the issue.
Should have said Node 18+ 😆
@pi0 I can confirm it works
@ahoiroman Can you please confirm if disabling early hints fixes the issue with RC.12?