To get this plugin and the TypeScript parser to work, currently it needs some basic configuration to be added to the ESLint configuration. This amount of configuration grows if it should only apply to TypeScript files, and it even increases more if you extend from a shared configuration (like airbnb's) that implements rules that aren't supported by the TypeScript ESLint parser.

With a configuration helper, we can enable everyone to automatically apply all Typescript-related stuff to your ESLint configuration. It would look something like this:

// .eslintrc.js// You need to wrap your configuration with a function provided by the ESLint plugin.module.exports=require('@typescript-eslint/eslint-plugin/config-helper')({// In there, include your normal ESLint configuration.extends:['eslint-config-airbnb','eslint-config-prettier','eslint-config-prettier/react'],plugins:['prettier'],env:{browser:true,},rules:{'prettier/prettier':'error',camelcase:['error',{properties:'never',ignoreDestructuring:false}],// You can also configure TypeScript rules here.'@typescript-eslint/restrict-plus-operands':'error',}});

Then, theconfig-helper function would apply all transformations needed to get the configuration working. So, the configuration that is actually exported looks like this:

{"extends": ["eslint-config-airbnb","eslint-config-prettier","eslint-config-prettier/react"],"plugins": ["prettier"],"env": {"browser":true,},"rules": {"prettier/prettier":"error","camelcase": ["error", {"properties:":"never","ignoreDestructuring":false }],  },"overrides": [    {"files": ["*.ts","*.tsx"],"parser":"@typescript-eslint/parser","plugins": ["@typescript-eslint"],"settings": {"import/resolver": {"node": {"extensions": [".js",".ts",".jsx",".tsx",".json"]},"typescript": {}},"import/extensions": [".js",".ts",".jsx",".tsx",".json"]      },"rules": {"camelcase":0,"@typescript-eslint/camelcase": ["error", {"properties:":"never","ignoreDestructuring":false }],"no-array-constructor":0,"@typescript-eslint/no-array-constructor": ["error"],"import/no-unresolved":0,"import/named":0,"react/jsx-filename-extension":0,"@typescript-eslint/restrict-plus-operands":"error"      }    }  ]}

So, what it basically does is:

• Adds an override for.ts and.tsx files with the right parser and plugin
• Checks which core rules are enabled (also inextends) that have a TypeScript-specific rule (likecamelcase &no-array-constructor in this example), and disables the core rule and enables the TS-specific one with the original config.
• Disables rules that are incompatible with or unnecessary for TypeScript (likeimport/no-unresolved andimport/named in this example)
• Moves all@typescript-eslint/* rule definitions to the override so they aren't enabled for non-TS files.

This way it's way easier to make ESLint compatible with TypeScript, as all needed config changes are handled for you.

Issues related to config, that would probably be helped by this helper:#36#109#118#147#154#177#265#266#267#268

If others agree that this would be helpful, I'm willing to try to make a PR that enables this.