본문 바로가기

Computer Science/[dev]web

css -> scss -> module.scss

728x90

컴포넌트 스타일 보다는 module 이 더 괜찮은것 같다.

 

모든 팀원이 스타일에 도가 터서, 날고긴다면, 컴포넌트 스타일도 나쁘지않을 것 같지만,

 

현실적으로 그냥 scss를 쓰는게 맞는것 같다.

 

리액트는 컴포넌트가 재귀적으로 호출 되기 때문에, scss. 해도 다른 컴포넌트의 스타일이랑 충돌이 나거나 곂칠수 있다.

그래서  module.scss 를 사용하는게 속 편하고 좋은것 같다. 

 

다만, 단축키 누르면 자동으로  className={cn('')} 요렇게 나오는 플러그인을 만들던가 해야겠다. 저거 다 치고 있으니깐, 또 생산성이 안나온다.

 

찾아보니깐 className 까지는 Shortcut 이 있는데 모듈형 까지는 숏컷을 지원해주는 플러그인은 못찾겠다. 

 

 

https://www.google.com/search?q=className+in+react+shortcut+in+vscode&rlz=1C5CHFA_enKR969KR969&ei=c7adYqfDI8_nwQO1rJjwBg&ved=0ahUKEwjnyPSJsJj4AhXPc3AKHTUWBm4Q4dUDCA4&uact=5&oq=className+in+react+shortcut+in+vscode&gs_lcp=Cgdnd3Mtd2l6EAMyBQghEKABOgcIABBHELADOhEILhCABBCxAxCDARDHARCjAjoOCC4QgAQQsQMQxwEQ0QM6CAgAEIAEELEDOgUIABCABDoOCC4QgAQQsQMQxwEQowI6EQguEIAEELEDEIMBEMcBENEDOgsIABCABBCxAxCDAToICC4QgAQQsQM6CwguEIAEELEDENQCOgsILhCABBDHARDRAzoECAAQAzoOCC4QgAQQsQMQgwEQ1AI6BAgAEB46BAgAEBM6BggAEB4QEzoICAAQHhANEBM6BggAEB4QCDoHCCEQChCgAToECCEQCjoECCEQFUoECEEYAEoECEYYAFDCBljqPWDtPmgFcAF4BIABywKIAag3kgEJMy4yOS4xMC4xmAEAoAEByAEKwAEB&sclient=gws-wiz#kpvalbx=_HLedYsu9E5GG-AarubnoBg16 

 

className in react shortcut in vscode - Google 검색

You can also bind any keyboard shortcut to the command id editor.emmet.action. ... For example, if you are editing a JavaScript React file, you will get ...

www.google.com

 

728x90