web-dev-qa-db-fra.com

ESLint Prefer import export par défaut / prefer-default-export

Salut, j'ai du mal à comprendre/faire disparaître cette erreur eslint avec mon projet React.

Prefer default export import/prefer-default-export

L'erreur Helpers.js pointe vers:

export function getItems() {
  fetch('./data/data_arr.js')
  .then(results => results.json())
  .then(results => this.setState({ items: results }));
}

importation de fonction:

import { getItems } from '../helpers/helpers';

componentDidMount() {
    getItems.call(this);
}

J'ai essayé en vain:

"rules": {
     "import/prefer-default-export": off,
     ...
}

Dois-je ajouter "par défaut" à la fonction? export default function getItems() {...}

Je vous remercie

reactjseslintrc
5
roshambo

Pour désactiver cet avertissement, vous pouvez ajouter le commentaire

/* eslint-disable import/prefer-default-export */

en haut du fichier dans lequel vous exportez getItems.

Remarque, Eslint vous donne juste un avertissement de style ici - il n'y a rien de "mal" avec votre code si vous avez l'intention d'exporter plus de fonctions de ce même fichier à l'avenir.

Cela dit, il est souvent préférable d'utiliser export default Lorsque vous n'exportez qu'un bit de code à partir d'un fichier. De cette façon, c'est une syntaxe plus agréable lorsque vous importez le code dans un autre fichier.

Exemple

Si vous souhaitez exporter n seul bit de code, vous pouvez utiliser export default. Avec export default function getItems() {...} votre import ressemblerait à import getItems from '../myFile';. Un avantage de l'utilisation de export default Signifie que vous êtes libre d'importer le fichier en utilisant n'importe quel nom qui vous plaît. par exemple. import somethingElse from '../myFile' Fonctionnerait bien aussi. Cette syntaxe est plus nette et plus claire si le fichier n'a qu'un seul objectif.

Cependant, si vous souhaitez exporter plusieurs bits de code à partir du fichier dans lequel vous exportez getItems() (ou souhaitez le faire ultérieurement), vous ne pouvez pas utiliser export default. Cela signifie que vous devez importer en utilisant le nom que vous avez exporté en utilisant. L'avantage ici est que vous pouvez exporter puis importer plusieurs bits de code à partir d'un seul fichier. par exemple. export {getItems, getPeople, getPets} Et import {getItems, getPeople} from '../myFile';

1
Jordan Rolph