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

Posted 2021-04-13

我有一个使用Babel进行javascript转换的webpack项目。要告诉Babel哪些浏览器在转换代码时要定位，我使用.browserslistrc文件。

我也对使用ESLint兼容性插件eslint-plugin-compat感兴趣，如果你使用的JS与你所针对的浏览器不兼容，它会警告你（ESLint插件也指.browserslistrc文件）。

所以我继续安装并将插件添加到我的.eslintrc.js文件中，它似乎工作正常。但是当我编译我的webpack项目时，ESLint指出我在我的代码中使用的功能，如Object.values()，与我的目标浏览器不兼容。嗯，是的，我知道 - 这就是为什么我使用Babel，所以这些功能转换为与我所针对的浏览器兼容的功能。

所以也许我在这里错过了一个关键点。如果我已经使用Babel转换为我所针对的浏览器中的兼容代码，那么在我的构建过程中是否还有eslint-plugin-compat的用途？

答案

我认为你应该使用babel-eslint，哪个

允许您使用梦幻般的ESLint来提示所有有效的Babel代码。

我只是计划进行此更改，因此我没有任何经验，但应该意味着它使eslint-plugin-compat不必要，因为没有“无效”代码应该去捆绑。

但另一方面，仍然有来自eslint-plugin-compat的有用提示，如window.screenLeft() is not supported in Firefox XY。在我看来，取消资格eslint-plugin-compat也会跳过这些提示。

更新您可以在https://github.com/amilajack/eslint-plugin-compat/issues/174上进行跟踪