陪伴抱怨解决路径 编辑

编程问答 2022-06-11

问题描述

我一直收到eslint错误import/no-unresolved，不确定如何解决。我知道这与babel有关，但我不确定如何让babel和eslint玩得开心。

我的babel.config.js文件：

module.exports = {
  presets: [['@babel/preset-env',{ targets: { node: 'current' } }],'@babel/preset-react'],plugins: [
    'babel-plugin-macros','@babel/plugin-Syntax-dynamic-import','@babel/plugin-transform-destructuring',[
      '@babel/plugin-proposal-class-properties',{
        loose: true,},],[
      '@babel/plugin-proposal-object-rest-spread',{
        useBuiltIns: true,[
      '@babel/plugin-transform-runtime',{
        helpers: false,regenerator: true,[
      '@babel/plugin-transform-regenerator',{
        async: false,};

...和我的.eslintrc.js文件

module.exports = {
  parser: 'babel-eslint',extends: 'airbnb',env: {
    browser: true,node: true,jest: true,es6: true,plugins: ['react','jsx-a11y'],parserOptions: {
    ecmaVersion: 6,sourceType: 'module',ecmaFeatures: {
      jsx: true,rules: {
    'object-curly-spacing': 2,'arrow-parens': ['error','as-needed'],'arrow-body-style': [2,'comma-dangle': [2,'always-multiline'],'import/imports-first': 0,'import/newline-after-import': 0,'import/no-dynamic-require': 0,'import/no-extraneous-dependencies': 0,'import/no-named-as-default': 0,'import/no-unresolved': 2,'import/prefer-default-export': 0,indent: [
      2,2,{
        SwitchCase: 1,'space-before-function-paren': 0,'jsx-a11y/aria-props': 2,'jsx-a11y/heading-has-content': 0,'jsx-a11y/label-has-associated-control': 2,'jsx-a11y/mouse-events-have-key-events': 2,'jsx-a11y/no-autofocus': 0,'jsx-a11y/role-has-required-aria-props': 2,'jsx-a11y/role-supports-aria-props': 2,'max-len': 0,'newline-per-chained-call': 0,'no-confusing-arrow': 0,'no-console': 1,'no-use-before-define': 0,'prefer-template': 2,'class-methods-use-this': 0,'react/forbid-prop-types': 0,'react/jsx-first-prop-new-line': [2,'multiline'],'react/jsx-filename-extension': 0,'react/prefer-stateless-function': 0,'react/jsx-no-target-blank': 0,'react/require-extension': 0,'react/prop-types': 0,'react/self-closing-comp': 0,'require-yield': 0,'import/no-webpack-loader-Syntax': 0,semi: ['error','always'],settings: {
    'import/resolver': {
      webpack: {
        config: 'config/webpack/development.js',};

每种类型的导入都会出现此问题：

screenshot of eslint errors

有什么建议吗？

编辑

我使用与本项目中相同的eslint设置创建了存储库。显示的错误与我看到的相同。

https://github.com/brandondurham/eslint-test

解决方法

由于要使用模块导入来验证现代JS，因此您至少必须更新eslint配置，以表示您希望获得ES2018（或更新版本）支持：

module.exports = {
  ...
  parserOptions: {
    ecmaVersion: 2018,sourceType: 'module',ecmaFeatures: {
      jsx: true,},...
};

由于https://eslint.org/docs/user-guide/configuring#specifying-parser-options的存在，我们知道ecmaVersion: 6对应于要求ESLint将您的代码验证为ES2015，该代码早于ES模块，因此可以正确地将任何import ... from "..."语句标记为错误。

我尝试使用大量精简的ESlint配置尝试您的github存储库：

module.exports = {
  parser: 'babel-eslint',extends: 'airbnb',env: {
    browser: true,node: true,jest: true,es6: true
  },plugins: ['react'],parserOptions: {
    ecmaVersion: 2018,rules: {
    'no-unused-vars': 0
  }
};

效果很好，所以：开始构建它直到崩溃，这样您才能更好地了解真正需要解决的问题。

babeljseslinteslintjavascript