Дайджест Vue и Nuxt: улучшения Pinia Colada и строгая типизация в Vue Language Tools

Экосистема Vue 3 и метафреймворка Nuxt продолжает активную синхронизацию инструментов корпоративного уровня. В конце октября вышел согласованный пакет обновлений, закрывающий давние проблемы управления серверными запросами и статического анализа однофайловых компонентов (SFC). Разбираем ключевые улучшения в свежих релизах библиотек.

Pinia Colada v1.4.9

Библиотека асинхронного серверного кэширования Pinia Colada, созданная членом команды ядра Vue Эдуардо Сан Мартином Морроте (@posva), получила важное обновление в репозитории Pinia Colada.

Главное новшество — автоматическая отмена активных запросов при размонтировании компонента (issue #666). Если пользователь быстро перелистывает страницы каталога, библиотека теперь сама прерывает фоновый сетевой вызов через нативный сигнал AbortController:

import { defineQuery } from 'pinia-colada';

export const useProductQuery = defineQuery(() => {
  return {
    key: ['product', id],
    query: ({ signal }) => fetch(`/api/products/${id.value}`, { signal }).then(r => r.json()),
    // Кэш сохраняется для метатегов SSR Head и не запрашивается повторно
    staleTime: 1000 * 60 * 5,
  };
});

Кроме того, во Vue DevTools появилась кнопка экспорта среза кэша в формате JSON (issue #670), что кардинально упрощает отладку состояний и передачу снапшотов данных при составлении баг-репортов.

@pinia/colada-nuxt v1.2.1

Официальный плагин интеграции для Nuxt обновился в релизе @pinia/colada-nuxt. Разработчики устранили опасную проблему утечки состояния между параллельными серверными запросами при SSR-рендеринге (issue #659).

Теперь состояние каждого запроса жестко изолировано на уровне конкретного экземпляра приложения:

// nuxt.config.ts: подключение модуля с безопасной изоляцией запросов
export default defineNuxtConfig({
  modules: ['@pinia/colada-nuxt'],
  colada: {
    autoImports: true,
  },
});

Алгоритм сборщика мусора теперь корректно утилизирует устаревшие ключи запросов при динамической смене параметров поиска, выводя понятное предупреждение разработчику при попытке принудительного удаления активного in-flight запроса. Если ты следишь за инструментарием Nuxt, вспомни наш разбор комбайн Vite+ 1.0, который отлично дополняет этот стек.

Vue Language Tools v3.3.14

Языковой сервер Volar и пакет Vue Language Tools избавились от фантомных красных подчеркиваний TypeScript в шаблонах.

Ключевые фиксы компилятора:

• Виртуальный код шаблона теперь изолирован от потока управления секции <script setup> (коммит d31557b), исключая ложные ошибки сужения типов;
• Аргумент $event в инлайн-обработчиках событий получил строгий нативный тип без необходимости ручного приведения к any;
• Пропсы динамических слотов в generic-компонентах больше не сваливаются в ошибочный тип never.

Обновления рекомендуются всем проектам на Vue 3: достаточно обновить зависимости командой pnpm update pinia-colada @pinia/colada-nuxt vue-tsc @vue/language-tools.