Skip to main content

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