👋 개요 사내 디자인 시스템을 프론트엔드에 적용시키기 위한 작업 중 디자인 토큰을 github에서 contents API를 통해 json 파일을 다운로드해야 하는 상황이 생겼다. (회사에서 메인 git 저장소로 github을 사용하지 않으나, 디자이너 분이 사용하기에 figma와의 연동이 가장 좋아 토큰을 github에서 관리하기로 했다.) 그냥 간단한 script를 짜서 돌리면 되겠다고 생각하고 typescript로 작성 후 이를 컴파일 없이 실행시키기 위해 ts-node를 설치하여 해당 .ts 파일을 실행시켰다. $ ts-node scripts/getToken.ts 🚨 으아아 공습경보! 공습경보! TypeError [ERR_UNKNOWN_FILE_EXTENSION]: Unknown file exten..
Unknown property 'css' found eslint(react/no-unknown-property) eslint에서 preset으로 eslint-config-airbnb를 사용하는 경우 'react/no-unknown-property' 룰이 기본적으로 활성화 되어있다. 해당 룰 참조: https://github.com/jsx-eslint/eslint-plugin-react/blob/master/docs/rules/no-unknown-property.md 기본적으로 css props는 jsx props에 존재하지않는 plugin props 같은 존재이기 때문에 @emotion/react 를 사용하여 jsx element에 css props를 전달하는 경우 eslint rule에 걸리게 된다. ..
👋 개요 Webpack v4로 구성되어있던 기존 프로젝트를 Vite로 Migration을 진행하는 과정에서 해당 에러가 발생하였다. TS2786: 'Example'은(는) JSX 구성 요소로 사용할 수 없습니다. TS2786: 'Example' cannot be used as a JSX component 당시 개발 환경은 다음과 같다. ⚒️ 개발환경 vite 4 typescript 5 react 17 react-dom 17 💻 시도 처음에 react package에서 type을 못가져오는 것 같아서 tsconfig의 paths 값을 만져주었다.(vite.config.ts의 resolve.alias 값도 만져주었다.) 특정 부분에서는 해결되었으나 react와의 의존성이 있는 다른 라이브러리에서 같은 에러가..