React eslint不识别webpack alias,报错import/no-unresolved

刚开始接触React,发现配置Webpack alias之后,eslint一直在报错.记录一下

如图,eslint无法识别路径别名,导致程序无法启动.

其中webstorme是可以正确识别@component指向那里的,说明webpack配置的没有问题.

---

解决方法

1 安装eslint-import-resolver-alias
2 在eslint配置文件.eslintrc.js里加入

settings: {
    'import/resolver': {
      alias: {
        map: [
          ['@component', './src/component'], //别名路径
        ],
      },
    },
  },