Выполняю урок по учебнику Start building with Next.js или по-русски Начните создавать с помощью Next.js

При подключении шрифтов в главе 3 Оптимизация шрифтов и изображений (Optimizing Fonts and Images) появляется ошибка:

Unhandled Runtime Error Error: Cannot read properties of undefined (reading ‘className’)

ошибка подключения шрифта в next.js
ошибка подключения шрифта в next.js

после попытки подключения шрифта в файле /app/ui/fonts.ts

import { Inter } from 'next/font/google';
export const inter = Inter({ subsets: ['latin'] });

и в файле /app/layout.tsx

import '@/app/ui/global.css';
import { inter } from '@/app/ui/fonts';
 
export default function RootLayout({
  children,
}: {
  children: React.ReactNode;
}) {
  return (
    <html lang="en">
      <body className={`${inter.className} antialiased`}>{children}</body>
    </html>
  );
}

А всё дело в том, что изначально сборка не видит шрифт Inter в одинарных кавычках ‘latin’. Хз почему, но я вместо ‘latin’ сразу сделал «cyrillic» (с двойными кавычками) и всё заработало. Даже потом ставил снова ‘latin’ и всё уже работало.