web-dev-qa-db-fra.com

Comment modifier les paramètres eslint pour comprendre l'importation absolue?

J'utilise create-react-app et je veux utiliser l'importation absolue depuis ./src.

Comme Dan Abramov recommandé j'ai ajouté .env avec NODE_PATH=src et il fonctionne.

Mais mon eslint ne comprend pas que le module existe déjà. Je reçois une erreur import/no-unresolved et import/extensions

Voici ma configuration eslint:

module.exports = {
parser: 'babel-eslint',
extends: 'airbnb',
rules: {
    'react/no-did-mount-set-state': 'off',
    'import/no-extraneous-dependencies': 'off',
    'no-use-before-define': 'off',
    'arrow-body-style': 'off',
    // uncommit on developing
    'no-console': 'off',
    'no-debugger': 'off',
  },
  globals: {
    browser: true,
    fetch: true,
    serviceworker: true,
    describe: true,
    it: true,
    expect: true,
    document: true,
  },

};

Et bien sûr, ce sera bien si vscode fera des suggestions pour moi par "src".

9

Vous devez utiliser eslint-plugin-import: https://github.com/benmosher/eslint-plugin-import

Et configurez vos paramètres eslint dans .eslintrc

module.exports = {
  ...   
  "settings": {
    "import/resolver": {
      "node": {
        "paths": ["src"]
      }
    },
  },
}

Ensuite, vous pouvez utiliser l'importation à partir du dossier src.

Exemple, si vous avez src/components/MyComponent.jsx, vous écrirez ceci:

import MyComponent from 'components/MyComponent.jsx';
22

Vous étendez la configuration eslint d'Airbnb, qui comprend eslint-plugin-import, dont la règle suivante est activée par défaut: no-absolute-path.

Voir: https://github.com/benmosher/eslint-plugin-import/blob/HEAD/docs/rules/no-absolute-path.md

Vous devrez peut-être modifier d'autres règles au-delà de cela.

1
Omar Bahareth