filename-extension
Full Name in eslint-plugin-react-naming-convention
react-naming-convention/filename-extension
Full Name in @eslint-react/eslint-plugin
@eslint-react/naming-convention/filename-extension
Features
🔍
⚙️
What it does
Enforces consistent use of the JSX file extension.
Examples
This rule enforces consistent file extensions for JSX files.
Rule Options
allow
: When to allow a JSX filename extension. Default is"as-needed"
. Possible values:"always"
: allow all file use JSX file extension."as-needed"
: allow JSX file extension only if the file contains JSX syntax.
extensions
: List of file extensions that should be treated as JSX files. Default is[".jsx", ".tsx"]
.ignoreFilesWithoutCode
: When set totrue
, this rule will ignore files that do not contain JSX syntax. Default istrue
.
Rule Options Examples
eslint.config.js
// ...
export default [
// ...
{
files: ["**/*.tsx"],
rules: {
"@eslint-react/naming-convention/filename-extension": ["warn", "as-needed"]
}
];
eslint.config.js
// ...
export default [
// ...
{
files: ["**/*.tsx"],
rules: {
"@eslint-react/naming-convention/filename-extension": ["warn", { "allow": "always" }]
}
];
eslint.config.js
// ...
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",
},
},
];