web-dev-qa-db-fra.com

Comment commander des importations avec la règle de commande d'importation de tslint

Sur mon projet, la règle "Import-Ordering" de tslint est utilisée.

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 n'est pas satisfait de cet ordre et tombe en panne avec une erreur

[2, 1]: Les sources d'importation d'un groupe doivent être classées par ordre alphabétique.
[4, 1]: Les sources d'importation d'un groupe doivent être classées par ordre alphabétique.

Cette page n'a pas beaucoup aidé, j'ai essayé de placer les importations de différentes façons, mais sans succès. Quel ordre sera correct? 

importtslint
19
Denis

Je suis d'accord que c'est déroutant. Le problème est que les comparaisons de chaînes source incluent les parties ../.. des noms de modules. Pour apaiser la règle, vous devrez donc les trier comme suit:

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';

La règle comporte deux parties et peut être configurée pour appliquer séparément les commandes des noms et des sources d'importation. Pour appliquer uniquement l'ordre des noms, vous pouvez utiliser une configuration comme celle-ci:

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

Cela créerait une erreur pour les importations comme celle-ci:

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

mais n'appliquerait pas l'ordre pour les chemins de module, etc.

33
cartant

cette erreur se produit bien s’il n’ya pas de nouvelle ligne vide ajoutée en tant que séparation entre les groupes d’importations.

importer * en tant que fs à partir de 'fs'; import * en tant que os à partir de 'os';

importer * comme barre de './bar';import * comme foo depuis' ./foo ';

remarquez également si l'erreur se lit comme ceci: (5,1): Les sources d'importation d'un groupe doivent être classées par ordre alphabétique. Cela signifie que dans le fichier spécifié, allez à la ligne 5 et appuyez sur Entrée pour ajouter une nouvelle ligne vide en tant que séparateur.

Je l'ai fait et cela a résolu mon problème. pour plus de références sur ce problème, consultez cette page

3
Oswaldo

Dans le fichier tslint.json add

  "rules": {
    "ordered-imports": [false],
    "object-literal-sort-keys": [false]
  }

Par exemple, le fichier tslint.json ressemblera à ceci

{
  "extends": [
    "tslint:recommended",
    "tslint-react",
    "tslint-config-prettier"
  ],
  "linterOptions": {
    "exclude": [
      "config/**/*.js",
      "node_modules/**/*.ts",
      "coverage/lcov-report/*.js"
    ]
  },
  "rules": {
    "ordered-imports": [false],
    "object-literal-sort-keys": [false]
  }
}
0
foobarfuu