使用eslint-plugin-compat和Babel一起使用

Question

I have a webpack project that uses Babel for JavaScript transpilation. To tell Babel which browsers to target when it transpiles my code, I use a .browserslistrc file.

I'm also interested in using the ESLint compatibility plugin, eslint-plugin-compat , which will warn you if you're using JS that is not compatible with the browsers you are targeting (the ESLint plugin also refers to the .browserslistrc file).

So I went ahead and installed and added the plugin to my .eslintrc.js file, and it seems to be working fine. But when I compile my webpack project, ESLint is pointing out features I'm using in my code, like Object.values() , that are not compatible with my target browsers. Well yeah, I know that - that's why I'm using Babel, so those features are converted to ones that are compatible for the browsers I'm targeting.

So maybe I'm missing a key point here somewhere. If I'm using Babel already to transpile to compatible code in the browsers I'm targeting, is there still any use for eslint-plugin-compat in my build process?

Answer 1

I think you should rather use babel-eslint , which

allows you to lint ALL valid Babel code with the fantastic ESLint.

I am just planning to make this change, so I don't have any experience with it, but should mean that it makes eslint-plugin-compat unnecessary, as no "invalid" code should go to the bundle.

But on the other hand, still there are useful hints from eslint-plugin-compat , like window.screenLeft() is not supported in Firefox XY . Disqualifying eslint-plugin-compat would also skip these hints in my opinion.

Update You can track this on https://github.com/amilajack/eslint-plugin-compat/issues/174