eslint-plugin-import 默认是无法识别 webpack 配置的 alias 的，比较常见的错误提示是这两条规则：import/no-unresolved与import/extensions。

  1. [eslint] Unable to resolve path to module ‘components/Layout’. (import/no-unresolved)
  2. [eslint] Missing file extension for “components/Layout” (import/extensions)

解决办法1：忽略

import/no-unresolved 提供了 ignore 配置，可以忽略一些不用检测包

  1. "import/no-unresolved": [
  2.   "error",
  3.   {
  4.   "ignore": ['@']
  5.   }
  6. ]

解决办法2：让eslint使用webpack alias配置

  1. 安装 eslint-import-resolver-webpack 这个插件

    1. npm i eslint-import-resolver-webpack -D

  2. 然后在.eslintrc.js中配置一下import/resolver，config配到webpack配置alias的配置文件

    1. "settings": {
    2. "import/resolver": {
    3.  "webpack":{
    4.      "config": "script/webpack.base.js"
    5.  }
    6. }
    7. },