[解決済み] tslintの輸入品発注ルールを使った輸入品の発注方法

質問

私のプロジェクトでは、tslintの"import-ordering"ルールが使用されています。

import CopyLensModal from './CopyLensModal';
import FetchStatus from '../../../../../state/generic/models/FetchStatus';
import FlexRow from '../../../../generic/components/FlexRow';
import Geofilter from '../../../../../state/geofilter/models/Geofilter';
import Input from '../../../../generic/components/Input';

import * as React from 'react';
import * as salert from 'sweetalert';

import { func } from '../../../../../types/func';
import { Iterable } from 'immutable';
import { Button } from 'react-bootstrap';

tslint はこの命令に満足せず、エラーでクラッシュします。

[2, 1]: グループ内のインポートソースはアルファベット順である必要があります。
[4, 1]: グループ内のインポートソースは、アルファベット順である必要があります。

このページ インポートをいろいろな方法で配置しようとしましたが、うまくいきませんでした。どの順番が正しいのでしょうか？

解決方法は？

紛らわしいというのは同意します。問題は、ソースの文字列比較に ../.. の部分はモジュール名なので、このルールを守るためには、このようにソートする必要があります。

import FetchStatus   from '../../../../../state/generic/models/FetchStatus';
import Geofilter     from '../../../../../state/geofilter/models/Geofilter';
import FlexRow       from '../../../../generic/components/FlexRow';
import Input         from '../../../../generic/components/Input';
import CopyLensModal from './CopyLensModal';

このルールには2つの部分があり、インポート名とソースの順序を別々に強制するように設定することができます。名前のみの順序付けを強制するには、次のような設定を使用します。

"ordered-imports": [true, {
  "import-sources-order": "any",
  "named-imports-order": "case-insensitive"
}]

そうすると、このようなインポートの場合、エラーが発生します。

import { A, C, B } from 'some-module';

が、モジュールパスの順序などを強制することはないでしょう。