JSON to Media Query String Converter

Common errors

• ReferenceError: require is not defined in ES module scope

  cause Attempting to use `require()` in an ES module environment (e.g., a Node.js project with `"type": "module"` in package.json or a `.mjs` file).
  fix If within Node.js ESM, use `const createRequire = require('module').createRequire; const requireLocal = createRequire(import.meta.url); const json2mq = requireLocal('json2mq');`. For browser environments or bundled ESM, ensure your bundler is configured to handle CommonJS modules.

• TypeError: (0, _json2mq.default) is not a function

  cause Incorrectly attempting to import the default CommonJS export of `json2mq` as a named or default ES module import that does not align with how bundlers might transpile it, especially when `esModuleInterop` is not configured or the environment is pure ESM.
  fix If using a bundler (like Webpack, Rollup), ensure it's correctly configured to handle CommonJS modules and their default exports. If in Node.js ESM, use the `createRequire` approach. Otherwise, the package might not be compatible with your setup.

Warnings

• breaking This package is abandoned. The latest version (0.2.0) was published 11 years ago and there have been no updates or security patches since. Using it in modern applications may introduce compatibility issues or security vulnerabilities.
  Fix: Consider migrating to a more modern and actively maintained library, or implement the media query string generation logic manually.
• gotcha The package is CommonJS-only (`require()`) and does not support ES Modules (`import`). This means it cannot be directly imported into modern Node.js or browser projects that use ESM without a compatibility layer or bundler configuration.
  Fix: For ESM projects, use `import json2mq from 'json2mq'` with a bundler (like Webpack or Rollup) configured to handle CJS modules, or use `module.createRequire` in Node.js for explicit CJS loading. Alternatively, find an ESM-native alternative.
• gotcha There are no TypeScript type definitions available for this package, either bundled or on DefinitelyTyped. This will result in a poor developer experience for TypeScript users, requiring manual declaration files (`.d.ts`) or `@ts-ignore` directives.
  Fix: If TypeScript types are critical, consider creating a `json2mq.d.ts` file with `declare module 'json2mq' { function json2mq(obj: any): string; export = json2mq; }` or seeking an alternative package with native TypeScript support.

Install

• npm install json2mq npm
• yarn add json2mq yarn
• pnpm add json2mq pnpm

Imports

• json2mq
  wrong:

  import json2mq from 'json2mq';

  correct:

  const json2mq = require('json2mq');

  This package is CommonJS-only and does not support ES module `import` syntax. It was last published over a decade ago.
• json2mq
  wrong:

  import { json2mq } from 'json2mq';

  correct:

  const json2mq = require('json2mq');
  json2mq({minWidth: 100});

  The default export is the function itself, and it is not a named export. It's only available via `require`.

Quickstart

Demonstrates how to import json2mq and generate various CSS media query strings from simple to complex JSON objects.

const json2mq = require('json2mq');

// Basic media query
console.log(json2mq({ minWidth: 768 }));
// Expected: '(min-width: 768px)'

// Complex query with multiple features and units
console.log(json2mq({ screen: true, minWidth: 1024, maxWidth: '120em', orientation: 'landscape' }));
// Expected: 'screen and (min-width: 1024px) and (max-width: 120em) and (orientation: landscape)'

// Multiple distinct media queries in an array
console.log(json2mq([
  { screen: true, minWidth: 100 },
  { handheld: true, orientation: 'landscape' }
]));
// Expected: 'screen and (min-width: 100px), handheld and (orientation: landscape)'