Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Rule] react/prop-types rule이 ts 에서도 필요할까? #28

Closed
boxersb opened this issue Sep 20, 2019 · 14 comments · Fixed by #29
Closed

[Rule] react/prop-types rule이 ts 에서도 필요할까? #28

boxersb opened this issue Sep 20, 2019 · 14 comments · Fixed by #29
Assignees
Milestone

Comments

@boxersb
Copy link

boxersb commented Sep 20, 2019

AS-IS: Rule of eslint-plugin-react

https://github.com/yannickcr/eslint-plugin-react/blob/master/docs/rules/prop-types.md

eslint-plugin-react 의 권장 Rule 로 'react/prop-types': 2 가 설정되어 있습니다.
(prop-types 설정 없으면 오류)

TO-BE

es6 프로젝트에서는 필요하지만, typescript 프로젝트에서는 무시해도 될것 같은데요..

 "overrides": [
        {
            "files": ["**/*.tsx"],
            "rules": {
                "react/prop-types": "off"
            }
        }
    ]

이런식으로 확장자 기반 오버라이딩을 하면 어떨까 합니다.
투표 부탁드려요!


댓글로 이모지 또는 새로운 의견을 남겨주세요~
ex) - 3️⃣ : 나는 요래조래

  • 1️⃣ : 기존안 유지 (ts에서도 필요하다!)
  • 2️⃣ : 제안대로 수정 (ts에서는 스킵)
  • 3️⃣ : 이 룰을 전부 off (js,ts 다 필요없다!)
@inbeom
Copy link
Contributor

inbeom commented Sep 20, 2019

3️⃣ 극단주의적입니다

@appear
Copy link

appear commented Sep 20, 2019

원래 그러했으니 .. 3 번 ...

@giwan-dev
Copy link
Contributor

2️⃣컴파일 때 문제 없었으면 런타임 때도 문제 없을거라 믿습니다..!ㅋㅋㅋ

@steve-triple
Copy link

3️⃣

@boxersb
Copy link
Author

boxersb commented Sep 20, 2019

그런데, 지금까지 ts에서 이거 안걸렸었는데, 어제 처음 걸리는 케이스를 발견했어요..
룰에 따르면 지금껏 써왔던 코드들도 다 걸렸어야할텐데 ;

@yceffort
Copy link

@boxersb
'compact' is missing in props validation react/prop-types
이런거 말씀하시는건가용?

@boxersb
Copy link
Author

boxersb commented Sep 23, 2019

네네 맞습니다. 근데 우회하는 방법도 있네요 ;;

const MyComponent = function({ ... }) { ... }

이렇게 선언하면 또 넘어가네요 ㅡㅡ;

@yceffort
Copy link

const MH4 = ({ children, ...props }) => (
  <H4 margin={{ top: 20, left: 30, right: 30 }} {...props}>
    {children}
  </H4>
)

이렇게 children 을 타입을 선언을 안해주면 터지던데,, 지금 https://github.com/titicacadev/triple-frontend 여기에서 위 에러가 미친듯이 터지네요 ㅠ.ㅠ

3️⃣ 가겠습니다.

@boxersb
Copy link
Author

boxersb commented Sep 23, 2019

3️⃣ 으로 땅땅 하겠습니다.

@yceffort 곧 까나리 공유 드리겠습니다.
이번에도 잘 부탁드립니다~~ 🙇

@boxersb
Copy link
Author

boxersb commented Sep 23, 2019

ts 에서 어떻게 하면 터지고, 어떻게 하면 안터지는지 확인해봤습니다.

이렇게 하면 터지고요..

function ExpireDateHolder({ availability, children }) {

이렇게 하면 통과됩니다 ;

function ExpireDateHolder({ availability, children }: any) {

ts에서는 타입을 지정해주면 눈감아주는군요..
그래도 귀찮긴 하니 수정할께요!

@boxersb
Copy link
Author

boxersb commented Sep 23, 2019

@yceffort 카나리 릴리즈 나갔습니다. 0.0.0-32e20d3 확인 부탁드립니다~

@yceffort
Copy link

넵 테스트 해보고 말씀드릴게요!

@boxersb boxersb added this to the v0.3.0 milestone Sep 23, 2019
@yceffort
Copy link

off 확인했습니다.

@boxersb
Copy link
Author

boxersb commented Sep 23, 2019

🙇

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging a pull request may close this issue.

9 participants