question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Newline between grouped imports

See original GitHub issue

I want my imports to not have any new lines between them. I followed the instructions here and am using the following rules:

.eslintrc.js:

module.exports = {
  ...
  rules: {
    ...
    'import/first': 'error',
    'import/newline-after-import': 'error',
    'simple-import-sort/imports': [
      'error',
      {
        groups: [
          [
            "^react",
            "^@?\\w",
            "^(main|core|arc-storybook|viz|design-system|placement|reporting|onboarding)(/.*|$)",
            "^\\u0000",
            "^\\.\\.(?!/?$)",
            "^\\.\\./?$",
            "^.+\\.s?css$",
          ],
        ],
      }
    ],
  },
};

I have a sample component, as seen here:

import React from 'react';
import { EuiButton } from '@elastic/eui/src/components/button/button';
import x from './bar';

const Foo: React.FC = () => <EuiButton>Click Me</EuiButton>;

export default Foo;

but when I run prettier-eslint --write src/Foo.tsx, it adds a space between the second and third import:

import React from 'react';
import { EuiButton } from '@elastic/eui/src/components/button/button';

import x from './bar';

const Foo: React.FC = () => <EuiButton>Click Me</EuiButton>;

export default Foo;

How can I make sure that a new line is not added between the second and third import statement? Thanks!

Issue Analytics

  • State:closed
  • Created 2 years ago
  • Comments:9 (4 by maintainers)

github_iconTop GitHub Comments

1reaction
jimmy-ecommented, Jun 2, 2021

Ok great, thanks for the help!

Fixed eslint:

module.exports = {
  parser: 'babel-eslint',
  plugins: ['simple-import-sort'],
  rules: {
    'simple-import-sort/imports': [
      'error',
      {
        groups: [
          [
            "^react",
            "^@?\\w",
            "^(main|core|arc-storybook|viz|design-system|placement|reporting|onboarding)(/.*|$)",
            "^\\u0000",
            "^\\.\\.(?!/?$)", "^\\.\\./?$",
            "^\\./(?=.*/)(?!/?$)", "^\\.(?!/?$)", "^\\./?$",
            "^.+\\.s?css$",
          ],
        ],
      }
    ],
  },
};
1reaction
jimmy-ecommented, Jun 1, 2021

Apologies @lydell , I should have done that first. I have reduced the eslint to as simple a config as possible but am still getting the same issue; maybe it is an issue with TypeScript. I will try duplicating the repo but without TypeScript and look into this further and will get back to you in a day or so.

Read more comments on GitHub >

github_iconTop Results From Across the Web

How to remove newline between import groups? #25 - GitHub
I want to remove line breaks between all import statements. This is my personal opinion because I usually don't put a newline between...
Read more >
How can I set "organize imports" to put each import on a new ...
When I press Shift + Alt + O however, it puts all the imports on the same line between brackets. Is there a...
Read more >
Goland inconsistently formats imports when they are grouped ...
Goland inconsistently formats imports when they are grouped and delimited with empty lines. However goland mixes all the imports in one group once...
Read more >
Configuration options for isort
Force isort to recognize a module as being a local folder. Generally, this is reserved for relative imports (from . import module). Type:...
Read more >
PEP 8 – Style Guide for Python Code
Should a Line Break Before or After a Binary Operator? ... You should put a blank line between each group of imports.
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found