import/order complains about inline requires

[mAAdhaTTah]

Rule config:

    'import/order': [
      'error',
      {
        groups: ['builtin', 'external', 'parent', 'sibling', 'index'],
        'newlines-between': 'never',
      },
    ],

Code:

import React from 'react';
import PropTypes from 'prop-types';
import { createGlobalStyle, ThemeProvider } from 'styled-components';

export const GlobalStyle = createGlobalStyle`
  @font-face {
    font-display: swap;
    font-family: 'font-name';
    src: url(${require('../fonts/font-name.eot')});
    src: url(${require('../fonts/font-name.woff2')}) format('woff2'),
      url(${require('../fonts/font-name.woff')}) format('woff'),
      url(${require('../fonts/font-name.ttf')}) format('truetype');
  }
`

It complains about the newline after the styled-components import as well as a newline after the last inline require. Not 100% sure this is a bug, admittedly, but I thought it would excuse inline requires that aren't assigned based on this. Happy to just disable this rule on this file if needed.

[ljharb]

Although all of those requires should be non-inline, i agree it's a bug that the rule considers them.

[golopot]

I noticed another false positive:

const foo = [
  require('fs'),
  require('./a'),
]

In this case elements order is likely intentional. The rule should not complain about it.

[ljharb]

given that it’s inline, i think that alone means the rule shouldn’t complain.