vite-plugin-set-head-in-order

Плагин Vite, который упорядочивает элементы внутри по правилам capo.js, сохраняя порядок элементов внутри каждой группы.

$3

- Правильный порядок элементов в влияет на производительность и корректность загрузки ресурсов.
- Плагин реализует порядок групп согласно правилам capo.js: meta, base, title, подсказки соединений, скрипты и стили в нужной последовательности, разделённые по типам.

$3

- Правила упорядочивания: capo.js — User rules

$3

``bash
pnpm add -D @budarin/vite-plugin-set-head-in-order

или

npm i -D @budarin/vite-plugin-set-head-in-order

или

yarn add -D @budarin/vite-plugin-set-head-in-order
`

$3

`ts
// vite.config.ts
import { defineConfig } from 'vite';
import setHeadInOrderPlugin from '@budarin/vite-plugin-set-head-in-order';

export default defineConfig({
plugins: [setHeadInOrderPlugin()],
});
`

$3

- Обрабатывает только прямых потомков head.
- Классифицирует элементы по группам в порядке capo.js и пересобирает head, сохраняя исходный порядок элементов внутри каждой группы.

Ключевые моменты порядка:

- Синхронные скрипты (inline и простые внешние без async/defer/module) идут ДО любых preload.
- Синхронные стили (link[rel="stylesheet"], style) стоят ПЕРЕД прелоадом стилей.
- Прелоад стилей — выше прелоада скриптов (modulepreload, preload[as="script"]).

$3

1. Базовые метаданные страницы: кодировка, служебные заголовки (http-equiv), настройки вьюпорта.
2. Базовый URL для ссылок (), затем заголовок страницы (