Статическая страница в Nuxt

Страница «О компании» или политика конфиденциальности редко меняются между деплоями. Их HTML можно собрать один раз при сборке и отдавать как готовый файл, не запуская Vue на каждый запрос. В Nuxt для такого адреса в routeRules включают флаг prerender.

Давайте изучим настройку для маршрута /about. Правило запишем в корневом конфиге проекта:

export default defineNuxtConfig({
	routeRules: {
		'/about': { prerender: true },
	},
});

Сама страница остаётся обычным файлом в app/pages. При npm run build Nuxt обходит маршруты с prerender, рендерит их на сервере сборки и сохраняет готовый HTML в каталог выдачи, в том числе для /about:

<template>
	<h1>
		About
	</h1>
	<p>
		Our company
	</p>
</template>

Сделайте страницу контактов по адресу /contacts и включите для неё предварительную генерацию через routeRules.

После сборки проверьте, что для /contacts в выдаче появился готовый HTML-файл.