(CSS) createGlobalStyle vscode prettier 적용 안됨

Next.js + TS + Styled components를 활용하여 서비스 페이지 제작하는 도중

글로벌 스타일의 필요성을 느껴 createGlobalStyle을 선언하였다.

 

기존에 html+css로 제작된 홈페이지의 css 코드를 그대로 붙여서 저장하였지만

prettier가 제대로 작동하지 않는다.

 

import { createGlobalStyle } from 'styled-components'
import { reset } from 'styled-reset'

export const GlobalStyle = createGlobalStyle`
  ${reset}

  * {
    box-sizing: border-box;
    -moz-box-sizing: border-box;
  }

대략 위에 처럼 시작한다.

 

stackoverflow에 천재들이 많다.

천재의 제안 아래와 같다.

 

prettier가 styled components 코드에 적용될 때

해당 부분 인식을 styled라는 키워드를 통해서 하는게 아닐까 하는 추측이다.