如何解决 react-create-app 里面的 no-unused-vars ?

如果每次启动都有一大串的no-unused-vars 是不是感觉特别烦,不用担心啦,有个配置可以解决它;

  1. 在Hbuild 里面可以新建一个 .eslintrc 其他文件(伤心的是我在webStorm 和其他编辑器都建不起来,提示必须输文件名);
  2. 就是npm run eject (暴露react-create-app 配置 ,这个操作不可逆)
  3. 在webpack.config.dev.js 中修改rules;
  4. 把它注释掉use: [
    // {
    // options: {
    // formatter: eslintFormatter,
    // eslintPath: require.resolve('eslint'),
    //
    // },
    // loader: require.resolve('eslint-loader'),
    // },
    // ],

  5. 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模块名使用帕斯卡命名,实例使用骆驼式命名
  }
}

你可能感兴趣的:(如何解决 react-create-app 里面的 no-unused-vars ?)