이슈 9 Parsing error: Unexpected token = eslint

이전 글에서 ESLint 사용을 설정해봤습니다.

'handler' is missing in props validationeslint(react/prop-types)

위대하신 ESLint에서 말하시길, props를 사용할 때 propTypes을 설정하라고 하는데요. 아래와 같이 설정하면 됩니다.

class SearchID extends Component {
  ...
}

SearchID.propTypes = {
  handler: PropTypes.func.isRequired
}

export default SearchID

하지만 저는 클래스 정의와 동시에 export 하기 때문에, propTypes를 클래스 내부에 static 변수로 설정하고 싶습니다.

위와 같이 propTypes을 설정했더니 또.. 다음과 같은 에러가 발생합니다...

Parsing error: Unexpected token = eslint

ESLint가 ES6 ~ 7을 파싱할 때 문제가 생기는 경우가 있다고 합니다. 위 문제는 babel-eslint 패키지를 설치하여 해결할 수 있습니다.

npm install babel-eslint --save-dev

# or

yarn add babel-eslint --dev

babel-eslint 설치 후에는 프로젝트 폴더의 .eslintrc 파일을 열고 아래 내용을 추가합니다.

"parser": "babel-eslint"

 

다음과 같이 더이상 경고가 생기지 않는 것을 볼 수 있습니다.