Tech정개블 2023. 12. 11. 13:18

Nuxt 3의 핵심 기능 중 하나는 레이어와 확장 지원이다. 기본 Nuxt 애플리케이션을 확장하여 구성 요소, 유틸리티 및 구성을 재사용할 수 있다. 레이어 구조는 표준 Nuxt 애플리케이션과 거의 동일하므로 작성 및 유지 관리가 쉽다.


사용 사례

  • nuxt.config 및 app.config 를 사용하여 프로젝트 전체에서 재사용 가능한 구성 사전 설정을 공유한다.
  • components/ 디렉터리를 사용하여 컴포넌트 라이브러리 만들기
  • composables/ 및 utils/ 디렉터리를 사용하여 유틸리티 및 구성 가능한 라이브러리 만들기
  • Nuxt 모듈 사전 생성
  • 프로젝트 전체에서 표준 설정 공유
  • Nuxt 테마 만들기

 

용법

nuxt.config.ts 파일에 확장 속성을 추가하여 레이어를 확장할 수 있다.

// nuxt.config.ts

export default defineNuxtConfig({
  extends: [
    '../base',                     // Extend from a local layer
    '@my-themes/awesome',          // Extend from an installed npm package
    'github:my-themes/awesome#v1', // Extend from a git repository
  ]
})

참고) 레이어 작성 가이드, 레이어에 관한 비디오 가이드