search

tleunen / eslint-import-resolver-babel-module

Custom eslint resolve for babel-plugin-module-resolver
https://github.com/tleunen/babel-plugin-module-resolver
MIT License
248 stars 31 forks source link

VSCode: Error while loading rule 'module-resolver/use-alias': Cannot find module './.babelrc' #123

Open aprilmintacpineda opened 1 year ago

aprilmintacpineda commented 1 year ago

Can someone give me an insight? This I'm getting this from my VSCode Eslint extention https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint

I'm trying to configure a custom eslint config for a react-native app but I'm getting this error:

[Error - 3:02:56 PM] An unexpected error occurred:
[Error - 3:02:56 PM] Error: Error while loading rule 'module-resolver/use-alias': Cannot find module './.babelrc'
Require stack:
- /Users/aprilmintacpineda/projects/nextjs-trpc-react-native/apps/mobile-app/node_modules/@babel/core/lib/config/files/configuration.js
- /Users/aprilmintacpineda/projects/nextjs-trpc-react-native/apps/mobile-app/node_modules/@babel/core/lib/config/files/index.js
- /Users/aprilmintacpineda/projects/nextjs-trpc-react-native/apps/mobile-app/node_modules/@babel/core/lib/index.js
- /Users/aprilmintacpineda/projects/nextjs-trpc-react-native/apps/mobile-app/node_modules/@babel/eslint-parser/lib/worker/babel-core.cjs
- /Users/aprilmintacpineda/projects/nextjs-trpc-react-native/apps/mobile-app/node_modules/@babel/eslint-parser/lib/worker/handle-message.cjs
- /Users/aprilmintacpineda/projects/nextjs-trpc-react-native/apps/mobile-app/node_modules/@babel/eslint-parser/lib/client.cjs
- /Users/aprilmintacpineda/projects/nextjs-trpc-react-native/apps/mobile-app/node_modules/@babel/eslint-parser/lib/index.cjs
- /Users/aprilmintacpineda/projects/nextjs-trpc-react-native/apps/mobile-app/node_modules/@eslint/eslintrc/lib/config-array-factory.js
- /Users/aprilmintacpineda/projects/nextjs-trpc-react-native/apps/mobile-app/node_modules/@eslint/eslintrc/lib/index.js
- /Users/aprilmintacpineda/projects/nextjs-trpc-react-native/apps/mobile-app/node_modules/eslint/lib/cli-engine/cli-engine.js
- /Users/aprilmintacpineda/projects/nextjs-trpc-react-native/apps/mobile-app/node_modules/eslint/lib/cli-engine/index.js
- /Users/aprilmintacpineda/projects/nextjs-trpc-react-native/apps/mobile-app/node_modules/eslint/lib/api.js
- /Users/aprilmintacpineda/.vscode/extensions/dbaeumer.vscode-eslint-2.4.0/server/out/eslintServer.js
Occurred while linting /Users/aprilmintacpineda/projects/nextjs-trpc-react-native/apps/mobile-app/src/App.tsx
    at Module._resolveFilename (node:internal/modules/cjs/loader:987:15)
    at resolve (node:internal/modules/cjs/helpers:108:19)
    at loadConfig (/Users/aprilmintacpineda/projects/nextjs-trpc-react-native/apps/mobile-app/node_modules/@babel/core/lib/config/files/configuration.js:216:5)
    at loadConfig.next (<anonymous>)
    at buildRootChain (/Users/aprilmintacpineda/projects/nextjs-trpc-react-native/apps/mobile-app/node_modules/@babel/core/lib/config/config-chain.js:65:47)
    at buildRootChain.next (<anonymous>)
    at loadPrivatePartialConfig (/Users/aprilmintacpineda/projects/nextjs-trpc-react-native/apps/mobile-app/node_modules/@babel/core/lib/config/partial.js:79:62)
    at loadPrivatePartialConfig.next (<anonymous>)
    at Function.<anonymous> (/Users/aprilmintacpineda/projects/nextjs-trpc-react-native/apps/mobile-app/node_modules/@babel/core/lib/config/partial.js:122:25)
    at Generator.next (<anonymous>)
[Error - 3:02:56 PM] An unexpected error occurred:
[Error - 3:02:56 PM] Error: Error while loading rule 'module-resolver/use-alias': Cannot find module './.babelrc'
Require stack:
- /Users/aprilmintacpineda/projects/nextjs-trpc-react-native/apps/mobile-app/node_modules/@babel/core/lib/config/files/configuration.js
- /Users/aprilmintacpineda/projects/nextjs-trpc-react-native/apps/mobile-app/node_modules/@babel/core/lib/config/files/index.js
- /Users/aprilmintacpineda/projects/nextjs-trpc-react-native/apps/mobile-app/node_modules/@babel/core/lib/index.js
- /Users/aprilmintacpineda/projects/nextjs-trpc-react-native/apps/mobile-app/node_modules/@babel/eslint-parser/lib/worker/babel-core.cjs
- /Users/aprilmintacpineda/projects/nextjs-trpc-react-native/apps/mobile-app/node_modules/@babel/eslint-parser/lib/worker/handle-message.cjs
- /Users/aprilmintacpineda/projects/nextjs-trpc-react-native/apps/mobile-app/node_modules/@babel/eslint-parser/lib/client.cjs
- /Users/aprilmintacpineda/projects/nextjs-trpc-react-native/apps/mobile-app/node_modules/@babel/eslint-parser/lib/index.cjs
- /Users/aprilmintacpineda/projects/nextjs-trpc-react-native/apps/mobile-app/node_modules/@eslint/eslintrc/lib/config-array-factory.js
- /Users/aprilmintacpineda/projects/nextjs-trpc-react-native/apps/mobile-app/node_modules/@eslint/eslintrc/lib/index.js
- /Users/aprilmintacpineda/projects/nextjs-trpc-react-native/apps/mobile-app/node_modules/eslint/lib/cli-engine/cli-engine.js
- /Users/aprilmintacpineda/projects/nextjs-trpc-react-native/apps/mobile-app/node_modules/eslint/lib/cli-engine/index.js
- /Users/aprilmintacpineda/projects/nextjs-trpc-react-native/apps/mobile-app/node_modules/eslint/lib/api.js
- /Users/aprilmintacpineda/.vscode/extensions/dbaeumer.vscode-eslint-2.4.0/server/out/eslintServer.js
Occurred while linting /Users/aprilmintacpineda/projects/nextjs-trpc-react-native/apps/mobile-app/.eslintrc.js
    at Module._resolveFilename (node:internal/modules/cjs/loader:987:15)
    at resolve (node:internal/modules/cjs/helpers:108:19)
    at loadConfig (/Users/aprilmintacpineda/projects/nextjs-trpc-react-native/apps/mobile-app/node_modules/@babel/core/lib/config/files/configuration.js:216:5)
    at loadConfig.next (<anonymous>)
    at buildRootChain (/Users/aprilmintacpineda/projects/nextjs-trpc-react-native/apps/mobile-app/node_modules/@babel/core/lib/config/config-chain.js:65:47)
    at buildRootChain.next (<anonymous>)
    at loadPrivatePartialConfig (/Users/aprilmintacpineda/projects/nextjs-trpc-react-native/apps/mobile-app/node_modules/@babel/core/lib/config/partial.js:79:62)
    at loadPrivatePartialConfig.next (<anonymous>)
    at Function.<anonymous> (/Users/aprilmintacpineda/projects/nextjs-trpc-react-native/apps/mobile-app/node_modules/@babel/core/lib/config/partial.js:122:25)
    at Generator.next (<anonymous>)

.eslintrc.js

const alias = require('./importAliases');
const unusedVarsIgnorePattern = '^_[0-9]+$';

module.exports = {
  settings: {
    react: {
      version: 'detect'
    },
    'import/ignore': ['react-native'],
    'import/resolver': {
      'babel-module': {
        extensions: ['.ts', '.tsx'],
        alias,
        cwd: './'
      }
    }
  },
  env: {
    browser: true,
    node: true,
    es6: true
  },
  root: true,
  plugins: ['@typescript-eslint', 'react', 'module-resolver'],
  extends: [
    '@react-native-community',
    'eslint:recommended',
    'plugin:@typescript-eslint/recommended',
    'plugin:react/recommended',
    'plugin:react-hooks/recommended',
    'plugin:import/errors',
    'plugin:import/warnings'
  ],
  globals: {
    Atomics: 'readonly'
  },
  parser: '@typescript-eslint/parser',
  parserOptions: {
    sourceType: 'module'
  },
  rules: {
    'brace-style': ['error', '1tbs', { allowSingleLine: false }],
    'no-multiple-empty-lines': ['error', { max: 1 }],
    'no-case-declarations': 0,
    'no-return-await': 'error',
    'import/no-unresolved': 0,
    'import/order': [
      'error',
      {
        'newlines-between': 'never',
        alphabetize: {
          order: 'asc',
          caseInsensitive: true
        }
      }
    ],
    'react/jsx-closing-tag-location': 'error',
    'module-resolver/use-alias': 2,
    'react-hooks/exhaustive-deps': 'error',
    'react-hooks/rules-of-hooks': 'error',
    semi: ['error', 'always'],
    quotes: ['error', 'single', { avoidEscape: true }],
    curly: ['error', 'multi-or-nest', 'consistent'],
    'linebreak-style': ['error', 'unix'],
    'no-duplicate-imports': [
      'error',
      {
        includeExports: true
      }
    ],
    'react/jsx-no-constructed-context-values': 'error',
    'react/prop-types': 0,
    'react/display-name': 0,
    'rest-spread-spacing': ['error', 'never'],
    'no-inline-comments': [
      'error',
      {
        // https://github.com/prettier/prettier/issues/7884#issuecomment-760175877
        ignorePattern: '_prettier-hack'
      }
    ],
    'jsx-quotes': ['error', 'prefer-double'],
    'prefer-spread': ['error'],
    'prefer-const': 'error',
    'no-useless-call': ['error'],
    'no-trailing-spaces': ['error'],
    'space-before-blocks': ['error', 'always'],
    '@typescript-eslint/no-unused-vars': [
      'error',
      {
        varsIgnorePattern: unusedVarsIgnorePattern,
        argsIgnorePattern: unusedVarsIgnorePattern,
        caughtErrorsIgnorePattern: unusedVarsIgnorePattern
      }
    ],
    'no-floating-decimal': ['error'],
    'comma-dangle': ['error', 'never'],
    'array-bracket-spacing': ['error', 'never'],
    'object-curly-spacing': ['error', 'always'],
    'switch-colon-spacing': [
      'error',
      {
        after: true,
        before: false
      }
    ],
    'space-unary-ops': [
      'error',
      {
        words: true,
        nonwords: false
      }
    ],
    'space-before-function-paren': [
      'error',
      {
        anonymous: 'always',
        named: 'always',
        asyncArrow: 'always'
      }
    ],
    'keyword-spacing': [
      'error',
      {
        before: true,
        after: true
      }
    ],
    'space-in-parens': ['error', 'never'],
    'block-spacing': 'error',
    'key-spacing': [
      'error',
      {
        singleLine: {
          beforeColon: false,
          afterColon: true,
          mode: 'strict'
        },
        multiLine: {
          beforeColon: false,
          afterColon: true,
          mode: 'strict'
        }
      }
    ],
    'generator-star-spacing': [
      'error',
      {
        before: false,
        after: true
      }
    ],
    eqeqeq: 'error',
    'no-empty': 'error',
    '@typescript-eslint/no-var-requires': 0,
    // not required anymore as of react@17
    'react/react-in-jsx-scope': 0
  }
};

babel.config.js

const alias = require('./importAliases');

module.exports = {
  presets: ['module:metro-react-native-babel-preset'],
  plugins: [
    [
      'module-resolver',
      {
        alias
      }
    ]
  ]
};

importAliases.js

// must be in sync with tsconfig
module.exports = {
  src: './src/'
};

related https://github.com/microsoft/vscode-eslint/issues/1618