英文:
How to fix link preload warning in Next.js app?
问题
我正在开发一个 Next.js 应用，版本是 13.4，控制台中出现了以下警告：
资源 <URL> 已使用链接预加载方式预加载，但在窗口加载事件后的几秒内未被使用。请确保它具有适当的 "as" 值，并且是有意预加载的。
错误的数量正在增加。
控制台截图：
英文:
I am developing a Next.js app with version 13.4 and I am getting this warning in the console:
The resource <URL> was preloaded using link preload but not used within a few seconds from the window’s load event. Please make sure it has an appropriate as value and it is preloaded intentionally.
The number of the error is increasing.
The console screenshot:
答案1
得分: 3
从警告图像来看，似乎您正在预加载CSS文件。在使用预加载时，您需要指定href和as属性。我认为您尚未添加as属性。
请像这样添加它们。
<link rel="preload" href="style.css" as="style" />
查看此文档以获取更多详细信息。
英文:
From the warning image, it looks like you are preloading css files. While using preload, you will need to specify href and as attributes. I think you have not added as attribute.
Add them like this.
<link rel="preload" href="style.css" as="style" />
Check this document for more details on this
答案2
得分: 0
我遇到了相同的问题，问题与谷歌字体有关，我成功解决了它，通过在尝试访问我想要的字体时添加preload:true。
示例：
export const font = Nunito({
subsets: ["latin"],
variable: "--font-general",
preload: true,
});
英文:
I had the same issue and mine was about google fonts and i managed to solve it by adding preload:true when im trying to access to the font that i want.
Example:
export const font = Nunito({
subsets: ["latin"],
variable: "--font-general",
preload: true,
});
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论