2022-02-06 게시 됨2022-05-15 업데이트 됨react1분안에 읽기 (약 151 단어)

cra + eslint(airbnb) extensions, no-unresolved 오류 해결

terminal

1
2
3

yarn create react-app . --template typescript
yarn eslint --init
yarn add -D eslint-config-airbnb@latest

cra + eslint(airbnb)
이렇게 리액트 프로젝트를 시작했을 때,

import/extensions
import/no-unresolved
react/jsx-filename-extension

이런 오류가 나온다
오류가 뜨지 않도록 eslintrc를 설정해주자

eslintrc

eslintrc.json

{
  // ...
  "rules": {
    "react/jsx-filename-extension": [
      "error",
      { "extensions": [".ts", ".tsx"] }
    ],
    "import/extensions": [
      "error",
      "ignorePackages",
      {
        "ts": "never",
        "tsx": "never"
      }
    ]
  },
  "settings": {
    "import/resolver": {
      "node": {
        "extensions": [".ts", ".tsx", ".js", ".jsx"]
      }
    }
  }
}

위처럼 설정해 주었다

참고

2020-12-15 게시 됨2021-08-01 업데이트 됨javascript몇 초안에 읽기 (약 79 단어)

eslint prefer-template

react typescript eslint airbnb style 로 웹 개발을 하고 있는데,
+ 로 문자열 이어붙이기를 사용했는데, eslint룰에 따라 자동 포맷팅 되었다!
eslint가 처음에는 불편하기만 했는데, 지금은 너무 좋다…

참고

https://eslint.org/docs/rules/prefer-template