Javascript: Naming files with named exports

[alfechner]

Please consider rule 10.6:

In modules with a single export, prefer default export over named export.

I conclude from this rule that it's fine to have a file with (1) a single default export or (2) with multiple named exports.

Further the style guide says in 23.6:

A base filename should exactly match the name of its default export.

Is there any such rule for files with named exports?

[ljharb]

Nope - I'd say that since a default export is what a module _is_, and named exports are what a module _has_, that if a module isn't anything but only has things, then you'd name it based on the common category all those things belong to.

[alfechner]

Nope - I'd say that since a default export is what a module _is_, and named exports are what a module _has_, that if a module _isn't_ anything but only _has_ things, then you'd name it based on the common category all those things belong to.

Thanks @ljharb for the super quick reply.

Is there any convention in regard to the casing of the file/directory in this regard (kebab-casing vs camelCase)?

[ljharb]

Do you have an example that's more than one word, where this would come up? Typically I see "actions", "constants", etc.

[alfechner]

@ljharb sure, let me try.

First, let's consider the default export case. I've got a file with a single function fooBar() which shall be exported. The function is named in camelCase according to rule 23.2 (naming--camelCase). According to rule 10.6 (prefer-default-export) I'd use a default export because my module has only one file. To be compliant with 23.6 (filename-matches-export) I'd name the file fooBar.js.

Let's assume I'm not exporting a function but a class FooBar. It's spelled in PascalCase according to 23.2 (naming--PascalCase). Applying 23.6 (filename-matches-export) the file name is FooBar.js now.

Conclusion: The naming convention (casing) of the default export defines eventually the file name.

Lets look at named exports now. Let's say there is a function and a class, fooBar() and Foo(). Both shall be exported. I've got more than one export so it's compliant with 10.6 (prefer-default-export) to use named exports. Now I'll come up with my own name for the file.

Question: Would I name it (1) myModule.js, (2) MyModule.js or even (3) my-module.js.

The argument for (3) (kebab-case) is to make clear that this file doesn't contain any default export.

[ljharb]

ok but why would you have a file that has no default export, but exports names of "fooBar" and "Foo"? That seems like the problem worth fixing.

[alfechner]

I've got a colleague who never uses default exports. In his opinion one should use named exports only.

[ljharb]

@alfechner that's an absurd position that's been debated many times on other issues on this repository.

[alfechner]

Thanks @ljharb, I understand. I appreciate your feedback.

[alfechner]

Issues w.r.t. default and named exports.

• #1365