반응형
React에서 Css를 스타일링할때 쓰이는 라이브러리중 Styled Component라이브러리가 유용합니다.
이때 Styled Components를 사용하여 React 컴포넌트에 CSS를 쉽게 디자인 할수 있습니다.
그런데 기본적으로 Styled Component를 사용할때 아래와 같이 WebStrom에서 가독성이 좋지 않습니다.
이때 Webstorm에서 Plugin으로 Styled Components 플러그인을 설치하면 좀 더 쉽게 Styled Components를 사용하실 수 있습니다.
설치방법은 다음과 같습니다.
1. Preference => Plugins => Browse repositories 로 이동
2. Styled Components & Styled JSX 플러그인 설치
3. 설치후 Plugins에서 Styled Components & Styled JSX 플러그인 사용 적용
적용한뒤 WebStrom을 재실행하면 다음과 같이 Styled Component를 적용한 컴포넌트가 가독성있게 바뀐 것을 확인할 수 있습니다.
반응형
'개발 도구 및 Git 사용법 > VSCode, Webstorm 등 개발도구' 카테고리의 다른 글
VSCode : prettier 환경 설정하기 (0) | 2024.12.15 |
---|---|
VSCode vs Webstorm : 개인적으로 둘다 써보고 느낀 장단점 (0) | 2024.11.28 |
SQLite : Sqlite DB 테이블 Json으로 변환하기 (+ SQLite 개념) (0) | 2023.03.13 |
Webstorm : 마지막 개행문자 자동으로 지워지는 옵션 끄기 (0) | 2022.05.27 |
WebStrom - 메모리 늘리기 (0) | 2020.12.14 |