jsx로 처리되는 변수들은 shadowing이 되서 eslint가 못찾아 낸다고 한다.

그래서 쓰고 있는데도 

is defined but never used같은 에러를 발생시킨다.

react도 직접 쓰지 않지만 jsx가 사용해서 필요한데 같은 에러가 나온다.


./eslintrc에


extends: ['eslint:recommended',  'plugin:react/recommended']

를 추가한다.


아니면 에러나는 줄 옆에 다음과 같은 주석을 단다.

// eslint-disable-line no-unused-vars


참고로 구체적으로 입맛에 맞는 설정도 가능하다.


{

  // I want to use babel-eslint for parsing!

  "parser": "babel-eslint",

  "env": {

    // I write for browser

    "browser": true,

    // in CommonJS

    "node": true

  },

  {

    "ecmaFeatures": {

      "jsx": true

    }

  },

  {

    "plugins": [

      "react"

    ]

  },

  // To give you an idea how to override rule options:

  "rules": {

    "quotes": [2, "single"],

    "eol-last": [0],

    "no-mixed-requires": [0],

    "no-underscore-dangle": [0],

    "react/display-name": 1,

    "react/jsx-boolean-value": 1,

    "react/jsx-no-undef": 1,

    "react/jsx-quotes": 1,

    "react/jsx-sort-prop-types": 1,

    "react/jsx-sort-props": 1,

    "react/jsx-uses-react": 1,

    "react/jsx-uses-vars": 1,

    "react/no-did-mount-set-state": 1,

    "react/no-did-update-set-state": 1,

    "react/no-multi-comp": 1,

    "react/no-unknown-property": 1,

    "react/prop-types": 1,

    "react/react-in-jsx-scope": 1,

    "react/require-extension": 1,

    "react/self-closing-comp": 1,

    "react/sort-comp": 1,

    "react/wrap-multilines": 1

  }

}

'FrontEnd > babel&webpack&eslint' 카테고리의 다른 글

error TS2300: Duplicate identifier  (0) 2018.04.29
please use config.optimization.minimize instead  (0) 2018.04.19
eslint] ES7 적용  (0) 2018.04.15
webpack css-loader  (0) 2018.04.14
react 설정  (0) 2018.04.14

+ Recent posts