enquire.js

library2.1.6jsnpmunverified

enquire.js is a lightweight, pure JavaScript library designed to programmatically respond to CSS media queries, enabling JavaScript logic to execute when media query conditions are met or unmet. It provides a clean API for registering handlers with `match`, `unmatch`, `setup`, and `destroy` callbacks, allowing developers to manage dynamic content or behavior based on responsive breakpoints. The library, currently at version 2.1.6, has no direct runtime dependencies, though it relies on the browser's native `window.matchMedia` API and would require a polyfill for environments that do not support it. Its primary differentiator was its small footprint and pure JavaScript approach without external dependencies, offering a robust solution for enhancing responsive web design beyond CSS alone. The project appears to be unmaintained, with its last significant update approximately nine years ago, indicating an abandoned status.

web-framework

npm install enquire.js

github ↗package ↗homepage ↗

INSTALL

IMPORT

SIG · ENQUIRE.JS

enquire.js

web-frameworkjavascriptv2.1.6

Install

—

Import

—

Disk

—

Pass rate

0/ 6

Env Coverage0 / 6

glibc

18–22

musl

18–22

Install & Compatibility

Where this runs

tested against v? · npm install

Install × environment matrix

Each cell = how many times install + import succeeded across repeated harness runs. Partial = flaky.
glibc = Debian/Ubuntu slim · musl = Alpine Linux

musl

node 18–226 runs

build_error

glibc

node 18–226 runs

build_error

Code

Verified usage

Verified import paths — ran on the pinned version, not inferred.

enquire

✓ import 'enquire.js'; // then access window.enquire

✗ import { enquire } from 'enquire.js'

enquire.js primarily operates by exposing a global `enquire` object. For modern ES Modules, it's typically imported for its side effects, and then the global `window.enquire` is accessed. Direct named or default imports are not supported.

enquire

✓ const enquire = require('enquire.js');

✗ const { enquire } = require('enquire.js');

In CommonJS environments, `require('enquire.js')` will execute the script, which then populates the global `enquire` object. The returned value of `require` itself might be the global object in some environments, but the intended usage is via the global scope.

Global Access

✓ <script src="path/to/enquire.min.js"></script> <script> enquire.register(...); </script>

This is the original and most straightforward method of using enquire.js, directly including it via a script tag which makes `enquire` available globally.

Demonstrates how to register a media query handler using the global `enquire` object, reacting to viewport width changes with `match` and `unmatch` callbacks.

import 'enquire.js'; // Ensure enquire is available globally after import if (typeof window !== 'undefined' && window.enquire) { window.enquire.register("screen and (max-width:1000px)", { match : function() { console.log("Media query (max-width:1000px) matched!"); // Add your logic here when the query matches }, unmatch : function() { console.log("Media query (max-width:1000px) unmatched!"); // Add your logic here when the query unmatches }, setup : function() { console.log("Handler setup once upon registration."); }, destroy : function() { console.log("Handler destroyed and cleaned up."); }, deferSetup : false }); // Example of unregistering after some time (optional cleanup) // const myHandler = { /* ... */ }; // window.enquire.register("query", myHandler); // setTimeout(() => { // window.enquire.unregister("query", myHandler); // }, 5000); } else { console.warn("enquire.js global object not found. Ensure it's correctly loaded."); }

Debug

Known issues

breakingenquire.js relies on the global `window.matchMedia` API. For older browsers (e.g., IE9 and below) or environments without `matchMedia`, a polyfill is required for the library to function correctly.

fix

Include a `matchMedia` polyfill, such as 'matchmedia-polyfill' or 'media-match', before loading enquire.js. Example: `<script src="path/to/matchMedia.polyfill.js"></script>`.

affects: All versions

gotchaThe library heavily relies on exposing a global `enquire` object. This can lead to conflicts if other scripts or libraries define a global variable with the same name. It is not designed for modern modular JavaScript environments where global pollution is typically avoided.

fix

Ensure `enquire` is not used by other global scripts. In modern projects, consider wrapping its usage in an IIFE or scope to minimize global exposure, or migrate to a more actively maintained media query utility.

affects: All versions

deprecatedThe enquire.js project appears to be abandoned. The last commit on its GitHub repository was 9 years ago, and there have been no new releases since version 2.1.6. This means it will not receive updates, bug fixes, or security patches, and may not be compatible with newer browser features or JavaScript standards.

fix

For new projects, consider modern alternatives like `window.matchMedia` directly, CSS container queries, or actively maintained libraries that provide similar functionality and better compatibility with contemporary web development practices.

affects: >=2.1.6

Errors

Common errors & fixes

Uncaught ReferenceError: enquire is not defined

The `enquire` object was not correctly loaded or is not available in the global scope when the code attempts to use it.

fix

Ensure `enquire.js` is loaded via a `<script>` tag before your dependent script, or if using a module bundler, ensure the import statement is correctly placed and the global `enquire` object is accessible (e.g., `import 'enquire.js'; window.enquire.register(...)`).

TypeError: window.matchMedia is not a function

The browser environment does not natively support the `window.matchMedia` API, which `enquire.js` depends on.

fix

You need to include a `matchMedia` polyfill for older browsers. Add a script tag linking to a polyfill (e.g., `matchmedia-polyfill`) before loading `enquire.js`.

Upgrade

Version history

2.1.6latest on npm

Audit

Dependencies

No dependency data recorded yet.

Agent activity

2 hits · last 30 days

node

Resources

githubhttps://github.com/WickyNilliams/enquire.js ↗

packagehttps://www.npmjs.com/package/enquire.js ↗

homepagehttp://wicky.nillia.ms/enquire.js ↗