iamturns / eslint-config-airbnb-typescript

Airbnb's ESLint config with TypeScript support
MIT License
1.05k stars 98 forks source link

Can't override 'no-use-before-define'? #323

Open TSoli opened 1 year ago

TSoli commented 1 year ago

Hi, it seems that I can't override the 'no-use-before-define' rule in my eslint config when I am using this config. I get errors using null-ls in neovim abut using styles before declaration in my react native project (a common pattern which is disallowed by this rule).

Here is my .eslintrc

module.exports = {
  env: {
    browser: true,
    es2021: true,
    'react-native/react-native': true,
  },
  extends: ['plugin:react/recommended', 'airbnb', 'prettier'],
  parserOptions: {
    ecmaFeatures: {
      jsx: true,
    },
    ecmaVersion: 'latest',
    sourceType: 'module',
    project: './tsconfig.json',
  },
  plugins: ['react', 'react-native', 'eslint-plugin-tsdoc', 'prettier'],
  rules: {
    'tsdoc/syntax': 'warn',
    'no-use-before-define': ['error', { functions: true, classes: true, variables: false }],
    'react/jsx-props-no-spreading': 'off',
    'react/react-in-jsx-scope': 'off',
    'react/jsx-uses-react': 'off',
    'linebreak-style': ['error', 'unix'],
    'react/jsx-filename-extension': [1, { extensions: ['.js', '.jsx'] }],
    'import/extensions': [
      'error',
      'ignorePackages',
      {
        js: 'never',
        jsx: 'never',
        ts: 'never',
        tsx: 'never',
      },
    ],
    'prettier/prettier': [
      'error',
      {
        endOfLine: 'auto',
      },
    ],
  },
  overrides: [
    {
      files: ['*.ts', '*.tsx', '*.js', '*.jsx'],
      extends: ['plugin:react/recommended', 'airbnb', 'airbnb-typescript', 'prettier'],
      parser: '@typescript-eslint/parser',
      plugins: ['react', 'react-native', '@typescript-eslint', 'eslint-plugin-tsdoc', 'prettier'],
      rules: {
        'tsdoc/syntax': 'warn',
        'no-use-before-define': ['error', { functions: true, classes: true, variables: false }],
        'react/jsx-props-no-spreading': 'off',
        'react/react-in-jsx-scope': 'off',
        'react/jsx-uses-react': 'off',
        'linebreak-style': ['error', 'unix'],
        'react/jsx-filename-extension': [1, { extensions: ['.js', '.jsx', 'ts', 'tsx'] }],
        // 'react/function-component-definiton': [
        //   2,
        //   { namedComponents: 'arrow-function', unnamedComponents: 'arrow-function' },
        // ],
        'import/extensions': [
          'error',
          'ignorePackages',
          {
            js: 'never',
            jsx: 'never',
            ts: 'never',
            tsx: 'never',
          },
        ],
        'prettier/prettier': [
          'error',
          {
            endOfLine: 'lf',
          },
        ],
      },
    },
  ],
  settings: {
    'import/resolver': {
      node: {
        extensions: ['.js', '.native.js', '.jsx', '.ts', '.tsx'],
      },
    },
  },
  ignorePatterns: ['node_modules/*'],
};

And here is my package.json

{
  "name": "advancetuition",
  "version": "1.0.0",
  "main": "node_modules/expo/AppEntry.js",
  "scripts": {
    "start": "expo start",
    "android": "expo start --android",
    "ios": "expo start --ios",
    "web": "expo start --web",
    "eject": "expo eject"
  },
  "dependencies": {
    "@expo/metro-config": "^0.7.1",
    "@expo/vector-icons": "^13.0.0",
    "@expo/webpack-config": "^0.17.0",
    "@fsouza/prettierd": "^0.23.4",
    "@react-native-async-storage/async-storage": "~1.17.3",
    "@react-native-community/datetimepicker": "6.2.0",
    "@react-native-picker/picker": "2.4.2",
    "@react-navigation/bottom-tabs": "^6.3.1",
    "@react-navigation/native": "^6.0.8",
    "@react-navigation/stack": "^6.1.1",
    "@types/lodash.clonedeep": "^4.5.7",
    "@typescript-eslint/eslint-plugin": "^5.60.0",
    "@typescript-eslint/parser": "^5.60.0",
    "clonedeep": "^2.0.0",
    "eslint-config-prettier": "^8.5.0",
    "eslint_d": "^12.2.1",
    "expo": "^46.0.0",
    "expo-status-bar": "~1.4.0",
    "firebase": "^9.6.11",
    "firebase-admin": "^11.4.1",
    "lodash.set": "^4.3.2",
    "prop-types": "^15.8.1",
    "react": "18.0.0",
    "react-dom": "18.0.0",
    "react-native": "0.69.9",
    "react-native-gesture-handler": "~2.5.0",
    "react-native-picker-select": "^8.0.4",
    "react-native-safe-area-context": "4.3.1",
    "react-native-screens": "~3.15.0",
    "react-native-user-avatar": "^1.0.8",
    "react-native-vector-icons": "^9.1.0",
    "react-native-web": "~0.18.7",
    "which": "^2.0.2"
  },
  "devDependencies": {
    "@babel/core": "^7.18.6",
    "@types/react": "~18.0.0",
    "@types/react-native": "~0.69.1",
    "eslint": "^8.43.0",
    "eslint-config-airbnb": "^19.0.4",
    "eslint-config-airbnb-typescript": "^17.0.0",
    "eslint-plugin-import": "2.25.3",
    "eslint-plugin-jsx-a11y": "6.5.1",
    "eslint-plugin-prettier": "^4.2.1",
    "eslint-plugin-react": "7.28.0",
    "eslint-plugin-react-hooks": "4.3.0",
    "eslint-plugin-react-native": "^4.0.0",
    "eslint-plugin-tsdoc": "^0.2.17",
    "prettier": "^2.7.1",
    "typescript": "^4.6.3"
  },
  "private": true
}

Thanks for any help you can provide.