Шрифты Next.js и переменные CSS ⇐ CSS

[Anonymous]

Я пытаюсь использовать «следующий» способ добавления шрифтов. Однако мне кажется, что то, как они объясняют, кажется чрезвычайно сложным, просто предварительно загрузить шрифт.
Я попытался экспортировать функцию, создающую шрифт, а затем использовать тег переменной для создания переменной CSS. Это не работает, я импортировал шрифт в свой файл page.js. Затем я экспортировал константную функцию, создающую шрифт с помощью этой переменной;

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

import { Oxygen } from "next/font/google";

export const oxygen = Oxygen({
display: 'swap',
variable: '--font-oxygen',
subsets: ['latin'],
})

Затем попытался использовать его в связанной таблице стилей CSS, установив для семейства шрифтов точную переменную, используя;

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

font-family: var(--font-oxygen);

Я пытаюсь изучить Nextjs, и это меня просто отталкивает. Это не сработает, я не хочу устанавливать имя класса моих атрибутов html в имя класса шрифта, если я не делаю все это неправильно.

Подробнее здесь: https://stackoverflow.com/questions/768 ... d-css-vars