Duplicate-selector-checker NPM

duplicate-selector-checker

A command-line tool to detect duplicate component selectors in your frontend projects. While it works with any framework that uses component selectors, it's particularly useful for Angular, Web Components, and similar frameworks.

Features

✨ Scans multiple directories for component files
🔍 Detects duplicate selectors across your codebase
📊 Provides detailed reports with file locations
🎨 Colorized output for better readability
🛠 Configurable component file suffix
📈 Shows summary statistics

Installation

# Using npm
npm install -g duplicate-selector-checker

# Using pnpm
pnpm add -g duplicate-selector-checker

# Using yarn
yarn global add duplicate-selector-checker

Quick Start

# Basic usage
duplicate-selector-checker "src/app;libs"

# With custom suffix
duplicate-selector-checker "src/app" --suffix ".component.js"

Documentation

Basic Example

Add to your package.json:

{
  "scripts": {
    "check-selectors": "duplicate-selector-checker \"src/app;libs\""
  }
}

Then run:

npm run check-selectors

Command Line Options

-s, --suffix <suffix>: Specify the component file suffix (default: .component.ts)
-v, --version: Show version number
-h, --help: Show help

Exit Codes

0: No duplicates found (success)
1: Duplicates found or error occurred
- Use || true in npm scripts to ignore failures
- Useful for CI/CD to catch selector conflicts

Supported File Types

By default, the tool looks for files with the .component.ts extension, but you can configure this using the --suffix option to support other file types.