← Back to utilities
string

slugify

Converts a string into a URL-friendly slug. This function performs the following steps: 1. Converts the string to lower case. 2. Replaces diacritics (e.g., français -> francais) and special cases like 'ß' -> 'ss'. 3. Replaces one or more spaces with the chosen separator (default '-'). 4. Replaces '&' with 'and' surrounded by separators. 5. Removes non-word characters except the chosen separator. 6. Collapses multiple separators and trims from start/end. Any single character is supported; occurrences of '-' in the normalized string are unified to the chosen separator. Returns '' for non-string input or whitespace-only strings.

Installation

npx fragmen add string/slugify

Source Code

// lib/utils/string/slugify.ts

/**
 * Converts a string into a URL-friendly slug.
 *
 * This function performs the following steps:
 * 1. Converts the string to lower case.
 * 2. Replaces diacritics (e.g., français -> francais) and special cases like 'ß' -> 'ss'.
 * 3. Replaces one or more spaces with the chosen separator (default '-').
 * 4. Replaces '&' with 'and' surrounded by separators.
 * 5. Removes non-word characters except the chosen separator.
 * 6. Collapses multiple separators and trims from start/end.
 *
 * @tags url, formatting, sanitization
 * @param {string} str The string to convert.
 * @param {object} options Options for slugification.
 * @param {string} options.separator The character to use as a word separator. Defaults to '-'.
 *   Any single character is supported; occurrences of '-' in the normalized string
 *   are unified to the chosen separator.
 * @returns {string} The slugified string.
 *   Returns '' for non-string input or whitespace-only strings.
 * @example
 * slugify('  Hello World!  -- 123  ')
 * // => 'hello-world-123'
 */
export function slugify(str: string, options?: { separator?: string }): string {
  const separator = options?.separator ?? '-';

  if (typeof str !== 'string' || str.trim() === '') {
    return '';
  }

  const a =
    'àáâäæãåāăąçćčđďèéêëēėęěğǵḧîïíīįìłḿñńǹňôöòóœøōõőṕŕřßśšşșťțûüùúūǘůűųẃẍÿýžźż·/_,:;';
  const b =
    'aaaaaaaaaacccddeeeeeeeegghiiiiiilmnnnnoooooooooprrsssssttuuuuuuuuuwxyyzzz------';
  const p = new RegExp(a.split('').join('|'), 'g');

  const escapeRegExp = (s: string) => s.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
  const sepRe = new RegExp(`${escapeRegExp(separator)}+`, 'g');
  const sepTrimStart = new RegExp(`^${escapeRegExp(separator)}+`);
  const sepTrimEnd = new RegExp(`${escapeRegExp(separator)}+$`);

  return (
    str
      .toString()
      .toLowerCase()
      // Special-case mappings not representable by single-codepoint mapping
      .replace(/ß/g, 'ss')
      // Replace diacritics/special latin chars
      .replace(p, c => b.charAt(a.indexOf(c)))
      // Replace spaces with chosen separator
      .replace(/\s+/g, separator)
      // Replace & with 'and' surrounded by separators
      .replace(/&/g, `${separator}and${separator}`)
      // Remove all non-word chars except for hyphen and chosen separator
      .replace(new RegExp(`[^\\w\\s${escapeRegExp(separator)}-]+`, 'g'), '')
      // Unify any hyphens produced by mapping into the chosen separator
      .replace(/-/g, separator)
      // Collapse multiple separators into one
      .replace(sepRe, separator)
      // Trim separators from start and end
      .replace(sepTrimStart, '')
      .replace(sepTrimEnd, '')
  );
}

Examples

slugify('  Hello World!  -- 123  ')
// => 'hello-world-123'

Related Utilities

camel-case

string

Converts a string to camelCase. Transforms a string by removing spaces, underscores, and hyphens, then capitalizing the first letter of each word except the first one. Commonly used for JavaScript variable names, object properties, and function names.

#pure#string-manipulation#formatting

capitalize

string

Capitalizes the first letter of a string. Converts the first character to uppercase while leaving the rest unchanged. Safely handles edge cases like empty strings and non-string inputs.

#pure#string-manipulation#formatting

kebab-case

string

Converts a string to kebab-case. Transforms a string by converting it to lowercase and replacing spaces, underscores, and camelCase boundaries with hyphens. Useful for creating URL slugs, CSS class names, and file names.

#pure#string-manipulation#formatting

pad-end

string

Pads the end of a string with another string until it reaches the target length. If padString is '', the original string is returned (mirrors native behavior).

#pure#string-manipulation#formatting

pad-start

string

Pads the start of a string with another string until it reaches the target length. If padString is '', the original string is returned (mirrors native behavior).

#pure#string-manipulation#formatting

pascal-case

string

Converts a string to PascalCase. Transforms a string by removing spaces, underscores, and hyphens, then capitalizing the first letter of each word including the first one. Commonly used for class names, interface names, type names, and component names.

#pure#string-manipulation#formatting

Quick Actions

Estimated size:2.72 KB

Tags

Parameters

strstring

The string to convert.

optionsobject

Options for slugification.

Returns

string

The slugified string.