camelcase

Enforce camelCase naming convention

camelcase

Enforce camelCase naming convention for variables and properties.

Rule Type: Suggestion
Fixable: No

Rule Details

This rule enforces camelCase naming: variableName instead of variable_name.

It ignores:

• Leading and trailing underscores
• ALL_CAPS constants
• Destructured property names (with option)
• Import names (with option)

Examples

Incorrect Code

import { no_camelcased } from "external-module";

const my_favorite_color = "#112C85";

function do_something() {
    // ...
}

obj.do_something = function() {
    // ...
};

function foo({ no_camelcased }) {
    // ...
}

const obj = {
    my_pref: 1
};

Correct Code

import { no_camelcased as camelCased } from "external-module";

const myFavoriteColor = "#112C85";
const _myFavoriteColor = "#112C85";  // Leading underscore OK
const MY_FAVORITE_COLOR = "#112C85";  // ALL_CAPS OK

function doSomething() {
    // ...
}

obj.do_something();  // Method call OK

const { category_id: categoryId } = query;  // Rename destructured

function foo({ isCamelCased }) {
    // ...
}

Options

properties

• "always" (default) - Check property names
• "never" - Don’t check property names

// With { "properties": "never" }
const obj = {
    my_pref: 1  // OK
};
obj.foo_bar = "baz";  // OK

ignoreDestructuring

Default: false

When true, don’t check destructured identifiers:

// With { "ignoreDestructuring": true }
const { category_id } = query;  // OK
const { category_name = 1 } = query;  // OK

This only affects the destructuring itself, not later uses of the variable.

ignoreImports

Default: false

When true, don’t check ES2015 imports:

// With { "ignoreImports": true }
import { snake_cased } from 'mod';  // OK

ignoreGlobals

Default: false

When true, don’t check global variables:

/* global no_camelcased */

// With { "ignoreGlobals": true }
const foo = no_camelcased;  // OK

allow

Type: string[]

Array of property names to allow (supports regex):

// With { "allow": ["UNSAFE_componentWillMount"] }
function UNSAFE_componentWillMount() {  // OK
    // ...
}

// With { "allow": ["^UNSAFE_"] }
function UNSAFE_componentWillMount() {  // OK
    // ...
}
function UNSAFE_componentWillReceiveProps() {  // OK
    // ...
}

Configuration Examples

// Default: Enforce camelCase everywhere
{
  "rules": {
    "camelcase": "error"
  }
}

// Don't check properties
{
  "rules": {
    "camelcase": ["error", { 
      "properties": "never" 
    }]
  }
}

// Allow destructuring snake_case
{
  "rules": {
    "camelcase": ["error", { 
      "ignoreDestructuring": true 
    }]
  }
}

// Allow snake_case imports
{
  "rules": {
    "camelcase": ["error", { 
      "ignoreImports": true 
    }]
  }
}

// Allow specific names
{
  "rules": {
    "camelcase": ["error", { 
      "allow": ["^UNSAFE_", "^DEPRECATED_"] 
    }]
  }
}

Common Patterns

API Responses

// API returns snake_case
const response = await fetch('/api/user');
const data = await response.json();

// Rename when destructuring
const { 
  first_name: firstName,
  last_name: lastName,
  user_id: userId 
} = data;

Database Columns

// Database uses snake_case
const rows = await db.query('SELECT user_id, first_name FROM users');

// Map to camelCase
const users = rows.map(row => ({
  userId: row.user_id,
  firstName: row.first_name
}));

Environment Variables

// ENV vars are SCREAMING_SNAKE_CASE
const API_KEY = process.env.API_KEY;  // OK - ALL_CAPS
const { NODE_ENV } = process.env;  // OK - ALL_CAPS

React Legacy Methods

// With allow: ["^UNSAFE_"]
class MyComponent extends React.Component {
  UNSAFE_componentWillMount() {  // OK
    // ...
  }
  
  UNSAFE_componentWillReceiveProps() {  // OK
    // ...
  }
}

When Not to Use It

Disable this rule if:

• Your style guide uses snake_case
• You’re working with APIs that use snake_case
• Your team hasn’t agreed on naming conventions

TypeScript

For TypeScript, you might also want:

• @typescript-eslint/naming-convention - More powerful naming rules

Related Rules

• id-length
• id-match
• new-cap