Skip to content

Responsive Media ​

2.1.0 ​

2026-10-02

  • Новое: модуль Nuxt responsive-media/nuxt. Опишите брейкпоинты один раз в ключе responsive файла nuxt.config.ts (breakpoints, order, debounce, ssrState); useResponsive() и useBreakpoints() подключаются автоматически и типизированы по этим брейкпоинтам, useMediaQuery() и useContainerState() тоже подключаются автоматически, а плагин устанавливает общее состояние на приложение. См. Интеграция с Nuxt.
  • Новое: defineResponsive(config, options?) в responsive-media/vue и responsive-media/react. Она применяет конфиг и возвращает useResponsive и useBreakpoints (в Vue ещё и plugin), у которых состояние и ключи брейкпоинтов выводятся из config, так что опечатка вроде isAbove('nope') — ошибка компиляции, а обобщённый параметр писать вручную не нужно.
  • Новое: опция ssrState в SetConfigOptions. Когда matchMedia или ResizeObserver недоступны — на сервере, — перечисленные ключи принимают эти значения вместо false, так что сервер может отрендерить раскладку. Она работает для createResponsiveState(), createContainerState(), setResponsiveConfig() и модуля Nuxt.
  • Типы: useContainerState() выводит ключи возвращаемого состояния из конфига (Vue и React), а BreakpointHelpers принимает необязательный тип ключа, BreakpointHelpers<K extends string = string>. Существующий код продолжает компилироваться.
  • Исправлено: useBreakpoints() в Vue игнорировал заданный order, когда состояние предоставлялось через ResponsivePlugin, и использовал порядок ключей конфига — поэтому current мог называть не тот брейкпоинт, если два порядка различались. Теперь используется заданный order.
  • Новая необязательная peer-зависимость: @nuxt/kit (^3.9.0 || ^4.0.0), нужная только для responsive-media/nuxt; Nuxt её уже предоставляет.