Bug: [naming-convention] Default import config clashes with common npm import patterns (PascalCase and other-cased imports)

[karlhorky]

Originally reported over here + confirmed by @JoshuaKGoldberg :

• feat(eslint-plugin): [naming-convention] add support for default and namespace imports #7269 (comment)

Before You File a Bug Report Please Confirm You Have Done The Following...

• I have tried restarting my IDE and the issue persists.
• I have updated to the latest version of the packages.
• I have searched for related issues and found none that matched my issue.
• I have read the FAQ and my problem is not listed.

Playground Link

https://typescript-eslint.io/play/#ts=5.2.2&fileType=.tsx&code=JYWwDg9gTgLgBAJQKYEMDG8BmUIjgcilQ3wG4AoIA&eslintrc=N4KABGBEBOCuA2BTAzpAXGUEKQAIBcBPABxQGNoBLY-AWhXkoDt8B6JgQwFtmBzWsgHsmAN0QtKw9GADa4bDkTRog6JAA08hVgXZIyREjL5V0yABNEAMw4J8GrbshXVXDvYxzdTst0MBhDgNIRwUAXU1vHCQOcz4AVSZLaGQhaEQzDnh4QQB3ByiofGgOSkYmXkTk1NUMjEgsnPzQsABfSN0db31DRGNTepEOKg4AIyQCqOdXd2kvQqhfLgCgjI7CyHiABS2AUQAlAH1-AEEAZV2QwoiW6MRYhKSlGvTM7LzJ7uLS8sqnlLSdSgjQ%2BLXaLS6TgMRhManqRFIABlKABrNa3KAuaBuDyyDE4LZBXzwQLBDFhMGOCkQVogVpAA&tsconfig=N4KABGBEDGD2C2AHAlgGwKYCcDyiAuysAdgM6QBcYoEEkJemy0eAcgK6qoDCAFutAGsylBm3TgwAXxCSgA&tokens=false

Repro Code

import React from 'react';

ESLint Config

This is using [the default rule configuration mentioned in the docs](https://github.com/typescript-eslint/typescript-eslint/blob/main/packages/eslint-plugin/docs/rules/naming-convention.md#options):


// the default config is similar to ESLint's camelcase rule but more strict
const defaultOptions: Options = [
  {
    selector: 'default',
    format: ['camelCase'],
    leadingUnderscore: 'allow',
    trailingUnderscore: 'allow',
  },

  {
    selector: 'variable',
    format: ['camelCase', 'UPPER_CASE'],
    leadingUnderscore: 'allow',
    trailingUnderscore: 'allow',
  },

  {
    selector: 'typeLike',
    format: ['PascalCase'],
  },
];


module.exports = {
  parser: "@typescript-eslint/parser",
  rules: {
    "@typescript-eslint/naming-convention": ["error", ...defaultOptions],
  },
};

tsconfig

{
  "compilerOptions": {
    "strictNullChecks": true
  }
}

Expected Result

Just upgraded to @​typescript-eslint/eslint-plugin@6.9.0 with the new import option for naming-convention config and received a number of new warnings, such as this one:

checkbox/index.js
Warning:   1:8  warning  Import name `React` must match one of the following formats: camelCase  @typescript-eslint/naming-convention

With this code:

import React from 'react';

I guess this is going to be a pretty common pattern that gets rejected now. 😬

Actual Result

Maybe the default configuration should accept every format as an import? (format: null)

Alternative: expect all users with default PascalCase imports (pretty common across the npm ecosystem, incl. React) and other case format eg. UPPER_CASE or snake_case to add the following to their config:

// the default config is similar to ESLint's camelcase rule but more strict
const defaultOptions: Options = [
  // ...

+  // Disable @typescript-eslint/naming-convention format for imports
+  // https://github.com/typescript-eslint/typescript-eslint/pull/7269#issuecomment-1777628591
+  {
+    selector: 'import',
+    format: null,
+  },
];

Additional Info

No response

[JoshuaKGoldberg]

Thanks for (re-)filing! I'll take this on, I should have caught that this would happen in PR review.

[karlhorky]

Glad to help :) Thanks for the quick turnaround!