Eslint-plugin-import: rule to ensure that default export matches module name

[graingert]

It would be great to have a rule that ensure that the default export matches module name:

eg

// good
//doSomething.js

export default function doSomething {
    ...
}

// bad
//dosomething.js

export default function doSomething {
    ...
}

[jfmengels]

I like the idea, though it's a really nitpicky style issue, as the name of the default import is rarely used anywhere else :sweat_smile:.

I usually name my files in kebab-case, as I like it that way, and because apparently that causes less problems/confusion for people with case-insensitive operating systems (--> mac users).

I think we could simply transform the name of the file to camelCase and see if that matches the exported value. In the case files with dots in their name (foo-bar.helper.js), we could check if the name matches any part of the transformed name (fooBar, helper or fooBarHelper). For index.js files, I'd recommend to skip the check though.

If the exported value has no name (=== arrow function, object/array/primitive/...), then I assume this is fin to ignore?

[graingert]

I like the idea, though it's a really nitpicky style issue, as the name of the default import is rarely used anywhere else :sweat_smile:.

I like to use:

import doSomething from './doSomething';

//doSomething.js
export default function doSomething() {
   ...
}

everywhere

I usually name my files in kebab-case, as I like it that way, and because apparently that causes less problems/confusion for people with case-insensitive operating systems (--> mac users).

I've got other lint rules for case-sensitive match, maybe you could add an option for "exact-match" or "kebab-case", or "snake-case"?
Also macOS APFS is case sensitive only.

I think we could simply transform the name of the file to camelCase and see if that matches the exported value.

I'd really rather enforce cameCase actually. perhaps that could be "any-case".

In the case files with dots in their name (foo-bar.helper.js), we could check if the name matches any part of the transformed name (fooBar, helper or fooBarHelper).

If I wanted a function called fooBarHelper I'd put it in a file called fooBarHelper.js Although I can see wanting to ignore for ".test.js"

For index.js files, I'd recommend to skip the check though.

I think it should use the directory name. FooBarBaz/index.js

If the exported value has no name (=== arrow function, object/array/primitive/...), then I assume this is fin to ignore?

yeah

[jfmengels]

True, but that's more of an import style issue (partially export too of course). You may be interested in this discussion https://github.com/sindresorhus/eslint-plugin-unicorn/issues/6.

[graingert]

@jfmengels I've seen https://github.com/sindresorhus/eslint-plugin-unicorn/blob/master/docs/rules/filename-case.md but it doesn't work for me, because I want:

// FooBar.js

export default class FooBar {
}

to work too.

[graingert]

@jfmengels sorry I posted my earlier comment before I'd finished it. See the completed version now...

[ljharb]

Also, foo/index.js should have an import named "foo" (following the same casing rules as if it was foo.js)

[graingert]

@ljharb foo/index.js must have a default export named "foo", iff it contains a default export that has a name.

[ljharb]

oops yes sorry, default export, not import. totally agreed.

[benmosher]

I think it will be extraordinarily difficult to come to any consensus on a versatile implementation.

That said: I wouldn't use this rule. I'm still not super into the style guide enforcement aspect of import linting. So feel free to ignore my curmudgeonry, I'm not the target user of this rule. 😎

If y'all are able to figure out something you think would be both useful and not cause a million nitpick issues to be filed, I'm cool with it. I'm concerned that it will be something pretty niche that people will want to customize, which makes me lean towards this being is a spin-off module.

[graingert]

I'm pretty much in agreement with @ljharb

I'm also OK with a config that chooses between an exact match or camel-case, or etc

[peet]

I believe that eslint-plugin-filenames already does what is being suggested here

[graingert]

@peet that looks about right

[graingert]

@ljharb https://github.com/airbnb/javascript/issues/1185

[wh1t3cAt1k]

I just wanted to let you guys know that eslint-plugin-filenames has been abandoned according to the author. I am one of those guys who would like to ensure that the exported entity name (even for non-default exports) matches the filename.