3

I have configured my eslint config to use absolute path . I used this manual https://dev.to/oliverandrich/absolute-imports-with-create-react-app-and-vscode-ihn . Everything runs fine, but eslint shows an error "Absolute imports should come before relative imports.eslint(import/first)" . I have tried to google it but no success. Any advise?

here is my eslint config:

{
  "parser": "babel-eslint",
  "parserOptions": {
    "sourceType": "module",
    "allowImportExportEverywhere": true
  },
  "extends": ["airbnb","react-app", "plugin:import/errors", "plugin:import/warnings"],
  "settings": {
    "import/resolver": {
      "node": {
        "moduleDirectory": ["node_modules", "src/"]
      }
    }
  },
  "env": {
    "jest/globals": true,
    "browser": true,
    "node": true
  },
  "rules": {
    "arrow-parens": [
      "off"
    ],
    "compat/compat": "error",
    "consistent-return": "off",
    "comma-dangle": "off",
    "flowtype-errors/show-errors": "error",
    "generator-star-spacing": "off",
    "import/no-unresolved": "error",
    "import/no-extraneous-dependencies": "off",
    "no-console": "off",
    "no-use-before-define": "off",
    "no-multi-assign": "off",
    "no-underscore-dangle": "off",
    "promise/param-names": "error",
    "react/no-array-index-key": "off",
    "promise/catch-or-return": "error",
    "promise/no-native": "off",
    "react/sort-comp": [
      "error",
      {
        "order": [
          "type-annotations",
          "static-methods",
          "lifecycle",
          "everything-else",
          "render"
        ]
      }
    ],
    "react/jsx-no-bind": "off",
    "react/jsx-filename-extension": [
      "error",
      {
        "extensions": [
          ".js",
          ".jsx"
        ]
      }
    ],
    "react/prefer-stateless-function": "off",
    "react/forbid-prop-types": [
      "error",
      {
        "forbid": []
      }
    ],
    "no-useless-escape": "off",
    "no-confusing-arrow": "off",
    "no-plusplus": "off",
    "jest/no-disabled-tests": "warn",
    "jest/no-focused-tests": "error",
    "jest/no-identical-title": "error",
    "jest/valid-expect": "error"
  },
  "plugins": [
    "flowtype",
    "flowtype-errors",
    "import",
    "promise",
    "compat",
    "react",
    "jest"
  ]
}
Yerlan Yeszhanov
  • 2,149
  • 12
  • 37
  • 67
  • 1
    Just change the order of imports - put absolute imports before relative imports in code. Its just code convention. – tarzen chugh Oct 07 '19 at 06:39
  • I working in team, they used to import modules first , then components. I don't want to change orders – Yerlan Yeszhanov Oct 07 '19 at 06:42
  • 1
    You can disable this rule in .eslintrc using- 'import/first': [ 'error', 'DISABLE-absolute-first' ] [Reference](https://github.com/vuetifyjs/vuetify/issues/3606) – tarzen chugh Oct 07 '19 at 06:49

0 Answers0