[Nuxt3] 3. Style 적용하기

sass/scss 를 사용 할 것인데 따로 패키지를 설치해 줘야 한다

yarn add -D sass sass-loader

위 두 패키지를 설치만 해주고 따로 설정은 하지 않아도 scss를 사용 할 수 있다

 

이제 root 경로에 assets 폴더를 만들고 scss 파일을 여기서 관리 하면 된다

nuxt 에서는 assets 폴더에서 css, image, font 등의 파일을 넣어놓고 관리 하기 때문에

scss 라는 폴더로 구분을 해서 관리하면 좋다

 

assets/scss/main.scss 라는 파일을 vue 파일에 임포트 하려면

 

style 태그 아래에

@import '~/assets/scss/main/scss';

이런식으로 사용 하면 된다.

style은 적용하기가 매우 쉽기 때문에 패키지만 잘 설치하면 문제 없이 작동 할 것이다