如何解决 react-create-app 里面的 no-unused-vars ?
如果每次启动都有一大串的no-unused-vars 是不是感觉特别烦,不用担心啦,有个配置可以解决它;
-
在Hbuild 里面可以新建一个 .eslintrc 其他文件(伤心的是我在webStorm 和其他编辑器都建不起来,提示必须输文件名);
-
就是npm run eject (暴露react-create-app 配置 ,这个操作不可逆)
-
在webpack.config.dev.js 中修改rules;
-
把它注释掉use: [
// {
// options: {
// formatter: eslintFormatter,
// eslintPath: require.resolve('eslint'),
//
// },
// loader: require.resolve('eslint-loader'),
// },
// ], -
use: [{
// @remove-on-eject-begin
// Point ESLint to our predefined config.
options: {
//configFile: path.join(__dirname, '../.eslintrc'),
useEslintrc: true
},
// @remove-on-eject-end
loader: 'eslint-loader'
}],
6. 在eslintrc 文件里编辑
{
"extends": "react-app",
"rules": {
"no-multi-spaces": 1,
"react/jsx-space-before-closing": 1, // 总是在自动关闭的标签前加一个空格,正常情况下也不需要换行
"jsx-quotes": 1,
"react/jsx-closing-bracket-location": 1, // 遵循JSX语法缩进/格式
"react/jsx-boolean-value": 1, // 如果属性值为 true, 可以直接省略
"react/no-string-refs": 1, // 总是在Refs里使用回调函数
"react/self-closing-comp": 1, // 对于没有子元素的标签来说总是自己关闭标签
"react/jsx-no-bind": 1, // 当在 render() 里使用事件处理方法时,提前在构造函数里把 this 绑定上去
"react/sort-comp": 1, // 按照具体规范的React.createClass 的生命周期函数书写代码
"react/jsx-pascal-case": 1 // React模块名使用帕斯卡命名,实例使用骆驼式命名
}
}
作者:人参,每篇随笔皆原创(除非注明原作者的随笔),欢迎指正!