Linter在导入webpack的样式文件时显示“no-unused-vars”

Question

我正在使用linter-eslint包含原子和React项目。我使用webpack作为打包程序，并且我导入了在构建过程中处理的sass样式。

当我在入口文件中导入样式时，我没有使用它，但是我需要将它导入，所以webpack会触发处理。我这样做：

import commonStyle from './public/styles/common.sass'; 

我得到错误no-unused-vars，因为它实际上没有在任何地方使用。

我可以设置no-unused-vars来抛出警告而不是错误，但我想知道是否应该以不同的方式执行导入操作，或者如果导入的文件的扩展名为.sass，则可以禁用该规则。

感谢您的帮助！

Answer 1

阅读ESLint docs for no-unused-vars之后，我意识到最好的方法是使用选项varsIgnorePattern。使用这个选项，我们可以定义一个将被linter忽略的正则表达式字符串。

另外，因为我使用的是eslint-config-react，所以我必须将^React$添加到忽略的字符串中，因为它随附该包。如果我只是覆盖varsIgnorePatter我每次导入React时都会出错。

的除了.eslintrc文件如下：

"no-unused-vars": [ 
    "error", 
    {"varsIgnorePattern": "_$|^React$"} 
] 

而现在的棉短绒会忽略所有瓦尔用下划线结尾，例如styles_