Important: This documentation covers Yarn 1 (Classic).
For Yarn 2+ docs and migration guide, see yarnpkg.com.

Package detail

html-space-cleaner

nati-grossman32MIT2.0.1TypeScript support: included

A TypeScript library that provides functions to normalize HTML strings by removing extra spaces and ensuring consistent formatting.

html, cleaner-html, spaces-html, remove-spaces-attributes, remove-spaces-html, remove-spaces, typescript

readme

HTML Space Cleaner

npm version npm downloads License TypeScript Node.js

A TypeScript library that provides functions to normalize HTML strings by removing extra spaces and ensuring consistent formatting. This library is perfect for cleaning up HTML output, ensuring consistent attribute formatting, and preparing HTML for comparison or processing.

Features

  • 🧹 Remove extra spaces from HTML attributes
  • 🔄 Normalize attribute formatting
  • 🎯 Remove extra spaces within HTML tags
  • 📦 Written in TypeScript with full type support
  • ✅ Comprehensive test coverage
  • 🚀 Zero dependencies

Installation

npm install html-space-cleaner

Usage

import {
  normalizeAttributes,
  removeExtraSpacesInTags,
  normalizeAttributesAndTags,
} from 'html-space-cleaner';

// Normalize specific attributes
const html = '<div class="  test   class  " id="  my-id  ">';
const normalized = normalizeAttributes(html, ['class', 'id']);
// Result: '<div class="test class" id="my-id">'

// Remove extra spaces in tags
const htmlWithSpaces = '<div   class="test"   >';
const cleaned = removeExtraSpacesInTags(htmlWithSpaces);
// Result: '<div class="test">'

// Combine both operations
const htmlToClean = '<div   class="  test  "   id="  my-id  ">';
const fullyNormalized = normalizeAttributesAndTags(htmlToClean, ['class', 'id']);
// Result: '<div class="test" id="my-id">'

API

normalizeAttributes(html: string, attributes: string[]): string

Normalizes specified attributes in an HTML string by removing extra spaces and ensuring consistent formatting.

const html = '<div class="  test  " id="  my-id  ">';
const result = normalizeAttributes(html, ['class', 'id']);
// Result: '<div class="test" id="my-id">'

Parameters

  • html: The HTML string to normalize
  • attributes: Array of attribute names to normalize

Returns

  • The normalized HTML string

removeExtraSpacesInTags(html: string): string

Normalizes an HTML string by removing extra spaces inside tags.

const html = '<div   class="test"   >';
const result = removeExtraSpacesInTags(html);
// Result: '<div class="test">'

Parameters

  • html: The HTML string to normalize

Returns

  • The normalized HTML string

normalizeAttributesAndTags(html: string, attributes: string[]): string

Combines both functions to normalize specified attributes and remove extra spaces within HTML tags.

const html = '<div   class="  test  "   id="  my-id  ">';
const result = normalizeAttributesAndTags(html, ['class', 'id']);
// Result: '<div class="test" id="my-id">'

Parameters

  • html: The HTML string to normalize
  • attributes: Array of attribute names to normalize

Returns

  • The normalized HTML string

Examples

Basic Usage

import { normalizeAttributes } from 'html-space-cleaner';

const html = `
  <div class="  container  " id="  main  ">
    <p style="  color:  red  ;">Hello, world!</p>
  </div>
`;

const result = normalizeAttributes(html, ['class', 'style']);
console.log(result);
// Output:
// <div class="container" id="  main  ">
//   <p style="color: red;">Hello, world!</p>
// </div>

Advanced Usage

import { normalizeAttributesAndTags } from 'html-space-cleaner';

const html = `
  <div      class="   container  "            id=" main  ">
    <p style="  color:  red  ;"      >Hello, world!</p>
  </div>
`;

const result = normalizeAttributesAndTags(html, ['class', 'style']);
console.log(result);
// Output:
// <div class="container" id="main">
//   <p style="color: red;">Hello, world!</p>
// </div>

Development

This project is written in TypeScript and uses Jest for testing.

# Install dependencies
npm install

# Run tests
npm test
npm run test:watch  # Run tests in watch mode

# Build the project
npm run build

# Format code
npm run format

# Lint code
npm run lint

Contributing

Contributions are welcome! Please feel free to submit a Pull Request.

License

MIT