component-name

Full Name in @eslint-react/eslint-plugin

@eslint-react/naming-convention/component-name

Full Name in eslint-plugin-react-naming-convention

react-naming-convention/component-name

Features

⚙️

Description

Enforces naming conventions for components.

Examples

Failing

import React from "react";

function My_component() {
  //     ^^^^^^^^^^^^
  //     - Expected component name to be in 'PascalCase'.
  return null;
}

Passing

import React from "react";

function MyComponent() {
  return null;
}

Rule Options

type Options = {
  rule?: "PascalCase" | "CONSTANT_CASE";
  excepts?: string[];
  allowAllCaps?: boolean;
};

`rule`

The naming convention rule to enforce for component names.

Default: "PascalCase"

`excepts`

An array of component names that are exempt from this rule.

Default: []

`allowAllCaps`

When set to true, component names that are entirely uppercase are allowed.

Default: false

Configuration Examples

{
  "@eslint-react/naming-convention/component-name": ["warn", "PascalCase"]
}

{
  "@eslint-react/naming-convention/component-name": ["warn", { "rule": "PascalCase", "allowAllCaps": true }]
}