Groups not being detected properly?

[sarink]

Am I misunderstanding something, or is this a bug? The newline is exactly in the right place.

"rules": {
  "import/order": [
    "warn",
    {
      "groups": ["builtin", "external", "parent", "sibling", "index"],
      "newlines-between": "always"
    }
  ],

import React from 'react';
import { hot } from 'react-hot-loader';
import { BrowserRouter, Route, Switch } from 'react-router-dom';   // <--- warning  There should be no empty line within import group  import/order

import { Footer } from 'components/Footer';
import { Header } from 'components/Header';
import { Login } from 'components/Login';

[ljharb]

And presumably if you delete the empty line, it no longer warns?

[sarink]

Correct

[spitlo]

I don’t think this is a grouping bug. It’s most likely caused by the plugin thinking that 'components/Footer' is an external module, since there’s no support for absolute paths for internal modules (or semi-absolute paths or aliased paths or whatever you call them, paths that are resolved by Webpack or such). I’m guessing components is a folder in your src folder?

If that’s the case for you, there are a few related issues: https://github.com/benmosher/eslint-plugin-import/issues/1292 https://github.com/benmosher/eslint-plugin-import/issues/684 https://github.com/benmosher/eslint-plugin-import/issues/807

The last one seems closest to a solution, and there’s a fork with a proposed solution you could try out, but it’s pretty old.

Perhaps it should be fixed by using a resolver. I will post back here if I find a solution.

[acorncom]

Found this today, seemed useful: https://acusti.ca/blog/2025/01/13/eslint-plugin-import-with-yarn-pnp/ Likely a path problem ...