Skip to content

Installation

Requirements

No required peer dependencies — the core (viewport/container state, utilities, presets) works standalone. Vue and React adapters activate automatically once the matching peer package is installed:

EnvironmentMinimum version
Node.js18+
Vue^3.5.27 (optional)
React^19.0.0 (optional, for /react)

Installation

bash
npm install responsive-media

No required peer dependencies. Vue and React adapters are available automatically when the respective package is installed:

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

Quick start

ts
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()