Rules
filename-extension
Full Name in @eslint-react/eslint-plugin
@eslint-react/naming-convention/filename-extensionFull Name in eslint-plugin-react-naming-convention
react-naming-convention/filename-extensionFeatures
⚙️
Description
Enforces consistent use of the JSX file extension.
Examples
This rule enforces consistent file extensions for JSX files.
Rule Options
type Options = "always" | "as-needed" | { allow: "always" | "as-needed", extensions?: string[], ignoreFilesWithoutCode?: boolean };allow
When to allow a JSX filename extension.
Default: "as-needed"
extensions
List of file extensions that should be treated as JSX files.
Default: [".jsx", ".tsx"]
ignoreFilesWithoutCode
When set to true, this rule will ignore files that do not contain JSX syntax.
Default: true
Configuration Examples
// ...
export default [
// ...
{
files: ["**/*.tsx"],
rules: {
"@eslint-react/naming-convention/filename-extension": ["warn", "as-needed"]
}
];// ...
export default [
// ...
{
files: ["**/*.tsx"],
rules: {
"@eslint-react/naming-convention/filename-extension": ["warn", { "allow": "always" }]
}
];// ...
export default [
// ...
{
files: ["**/*.tsx"],
rules: {
"@eslint-react/naming-convention/filename-extension": ["warn", "always"],
},
},
{
files: ["src/**/use*.tsx"],
rules: {
"@eslint-react/naming-convention/filename-extension": [
"warn",
"as-needed",
],
},
},
{
files: ["fixtures/**/*.tsx"],
rules: {
"@eslint-react/naming-convention/filename-extension": "off",
},
},
];Implementation
See Also
filename
Enforces consistent file naming conventions.