Eslint-plugin-import: import/extensions should have a ignorePackages option

[laurentgoudet]

Currently setting import/extensions to always reports the following as an error:

import jQuery from 'jquery';

However, packages default entry point (and extension) should be resolved by the loader, so it doesn't really make sense to do:

import jQuery from 'jquery'/index.js;

[benmosher]

This makes sense to me.

Feels like another mode between always and never. A flag wouldn't be meaningful in never mode.

[vvo]

Great! I too want to force extensions only for everything that is not a main entry in package.json

"extensions" : ["error", "always", {allowMainEntry: true}]?

"extensions": ["error", "as-needed"]?

Naming is hard :D

[benmosher]

maybe [ "error", "always", "!packages" ]? naming _is_ hard 😅

[vvo]

Do you have other example of eslint rules with two different string parameters?

I am not comfortable with "!packages", again do you have example of an eslint rule having that sort of string based configuration with a negation?

Why not provide an option object an drop the string based one? Major ftw :D

[benmosher]

I think a string and then a flag object is probably ideal. No one is surprised by booleans on an options object.

Or maybe ["error", "always", { packages: "never" }], so it's obvious the object is overriding.

I suppose this new behavior would ignore index.js files too. Not sure how to denote that via the flag override name.

[vvo]

I would not ignore index.js files, only packages.

[benmosher]

Sure, but if ./foo/index.js exists,

import { x } from './foo' // acceptable
// vs
import { x } from './foo/index' // definitely still reported

I think of index.js being the default value of package.json/main, but maybe that's just me.

[vvo]

In my project I specifically want to always enforce file extensions on anything that is not the main export of an external package.

Again that's also maybe just me, but this is what I am looking for.

[vvo]

My goal being: when looking at local imports, I never want to ask myself: "Is this a folder? Is this the index.js file?" => always be specific on local

[benmosher]

Ah, got it. I'm not sure that the two are distinguishable, ATM (explicit package main vs. implicit folder index file). (edit: without some additional resolver enhancements)

Would it be workable if it ignored both? or are you depending on this rule to suss out implicit index references?

[vvo]

Yep for a first start and if it requires a lot of changes it would work for me but ultimately I would love to have something like "disallowImplicit: true" "allowMainPackage: true" :)

[benmosher]

Yeah, seems like an anti-version of #394. I'd be up for that, but feels like a separate problem (and rule) than this one, just mandating extensions.

[collinsauve]

This really is a must-have in order to use this rule.

(edit: as others have noted, should read "in order to use this rule to require specifying .js on non-module imports")

[ljharb]

(note: it's only a must-have if you want to require extensions for files that are the "main" export of packages - the airbnb config's settings forbid JS extensions, and require them for non-JS files, so it doesn't run into trouble here)

[SimenB]

@ljharb then I've misunderstood the issue. My understanding is that the OP _doesn't_ want to use the extension on the main export of packages. Are you saying setting always and having import jQuery from 'jquery'; works now?

[ljharb]

@SimenB no, i'm saying that if you don't choose "always" for JS files, then it works fine.

This issue only exists when you require extensions on .js files.

[SimenB]

Ah, gotcha. I've heard import will require file extension according to spec (can't tell where though, might have imagined it!). That might be wrong, though?

Also: https://twitter.com/mathias/status/861843640615829506

[ljharb]

@SimenB in node, import will search for .mjs first. Extensions will continue to be optional, and omitting them will continue to be best practice.

[collinsauve]

Here's a PR: #827

I went with the "ignorePackages" naming, as an option instead of using "always". Open to suggestions for configuration structure if we can reach a consensus.

[ondasStevo]

I had the similiar problem and I fixed it with this line of code in my .eslintrc config:
"import/extensions": ["error", "never", { "packages": "always" }]

And in component I call resources like this:
import React from 'react';
import Sidebar from '../../sidebar/Sidebar';

[kruegelstein]

We have the same problem. We want to always require the "js" extension because we're also having "jsx" extensions and want to avoid confusion. Unfortunately there is still no option which fixes this for packages. The comment above is about never requiring extensions so it won't fix anything :/