🔍 browser-query-utils

Lightweight, safe helpers for getting, setting, and deleting URL query parameters — with modern ESM, CJS, and UMD builds.

Features

• Zero runtime dependencies
• Browser-focused utilities (Node.js supported via CJS)
• Get, set, and delete query parameters
• Handles full URLs, relative URLs, and hash fragments
• Minified build for production
• Linted and formatted with ESLint + Prettier

Installation

NPM (Modern ESM / CJS)

npm install browser-query-utils@2

ESM import (modern bundlers):

import { getQueryParams, setQueryParams, deleteQueryParams } from 'browser-query-utils';

CJS import (Node.js / legacy bundlers):

const { getQueryParams, setQueryParams, deleteQueryParams } = require('browser-query-utils');

Browser (UMD / CDN)

<script src="https://cdn.jsdelivr.net/npm/browser-query-utils/dist/browser-query-utils.umd.js"></script>

Available Builds

| File | Format | Notes | | -------------------------------- | ---------- | --------------------------------------- | | browser-query-utils.js | ESM | Non-minified, modern bundlers | | browser-query-utils.min.js | ESM | Minified, production-ready (ES module) | | browser-query-utils.cjs.js | CJS | Non-minified, Node.js / CommonJS | | browser-query-utils.cjs.min.js | CJS | Minified, production-ready | | browser-query-utils.umd.js | UMD | Legacy browsers / script tag & CommonJS | | browser-query-utils.min.js.map | Source map | For minified ESM |

Usage by environment

ES Modules (recommended)

import { getQueryParams, setQueryParams, deleteQueryParams } from 'browser-query-utils';

setQueryParams(
  'https://example.com/?foo=bar',
  {
    foo: 'updated',
    baz: 42
  }
);

CommonJS

const { getQueryParams, setQueryParams, deleteQueryParams } = require('browser-query-utils');

setQueryParams(
  'https://example.com/?foo=bar',
  {
    foo: 'updated',
    baz: 42
  }
);

Browser (script tag / CDN)

<script src="https://cdn.jsdelivr.net/npm/browser-query-utils/dist/browser-query-utils.umd.js"></script>
<script>
  browserQueryUtils.setQueryParams(
    'https://example.com/?foo=bar',
    {
      foo: 'updated',
      baz: 42
    }
  );
</script>

The global browserQueryUtils is available only when using the UMD build.

API Usage

Get query parameters

import { getQueryParams } from 'browser-query-utils';

const params = getQueryParams("https://example.com/?foo=bar&baz=42");
// returns: { foo: "bar", baz: "42" }

Set or update query parameters

import { setQueryParams } from 'browser-query-utils';

const newUrl = setQueryParams("https://example.com/?foo=bar", { baz: 42, foo: "updated" });
// returns: "https://example.com/?foo=updated&baz=42"

Delete query parameters

import { deleteQueryParams } from 'browser-query-utils';

const newUrl = deleteQueryParams("https://example.com/?foo=bar&baz=42", "baz");
// returns: "https://example.com/?foo=bar"

You can delete multiple keys by passing an array:

import { deleteQueryParams } from 'browser-query-utils';

deleteQueryParams(url, ["foo", "baz"]);

License

MIT © Sami Ahmed Siddiqui