Как использовать несколько шрифтов в NextJs ⇐ CSS

[Anonymous]

У меня проблемы с загрузкой нескольких веб -шрифтов Google в приложении NextJS. Я следую за документацией.

Код: Выделить всё

import { Inter, Heebo } from "next/font/google";

export const inter = Inter({ subsets: ["latin"], display: "swap" });
export const heebo = Heebo({ subsets: ['latin'], display: "swap" })

В моем майоне.

Код: Выделить всё

import type { Metadata } from "next";
import "./globals.css";
import { inter } from './fonts';

export const metadata: Metadata = {
title: "NextJS Stack Overflow Test.",
description: "Generated by create next app",
};

export default function RootLayout({
children,
}: Readonly) {
return (

{children}

);
}

И у меня есть два тестовых заголовка на моей странице.

Код: Выделить всё

import { heebo } from './fonts';

export default function Home() {
return (

Heebo
Roboto

);
}

Получил здесь репонирование GitHub с следующим кодом, включенным выше:
https://github.com/freddie-pike/nextjs_ ... k_overflow />https://nextjs-font-stack-overflow.vercel.app/
Кто-нибудь знает, что на ходу?

Подробнее здесь: https://stackoverflow.com/questions/786 ... -in-nextjs