Installation

Requirements

No required peer dependencies — the core (viewport/container state, utilities, presets), imported from the package root, works standalone with neither Vue nor React installed. The Vue and React adapters each live at their own subpath, so importing the root never pulls in either framework:

Environment	Minimum version
Node.js	18+
Vue	^3.5.27 (optional, for /vue)
React	^19.0.0 (optional, for /react)
Nuxt	^3.9.0 || ^4.0.0 (optional, for /nuxt)

Installation

npm install responsive-media

No required peer dependencies. Import the Vue adapter from responsive-media/vue and the React adapter from responsive-media/react once the matching package below is installed:

npm install vue@^3.5.27     # for Vue composables
npm install react@^19.0.0   # for React hooks

For Nuxt there is nothing else to install: add 'responsive-media/nuxt' to modules — see Nuxt Integration.

Quick start

import { responsiveState, setResponsiveConfig } from 'responsive-media'

setResponsiveConfig({
  mobile: [{ type: 'max-width', value: 767 }],
  tablet: [
    { type: 'min-width', value: 768 },
    { type: 'max-width', value: 1023 },
  ],
  desktop: [{ type: 'min-width', value: 1024 }],
})

// Read current state
console.log(responsiveState.proxy.mobile) // true / false

// Subscribe to changes
const stop = responsiveState.subscribe((state) => {
  console.log('desktop:', state.desktop)
})

// Cleanup
stop()