Nuxt에서 Vite 플러그인 사용하기
Nuxt 프로젝트에 Vite 플러그인을 통합하는 방법을 배워보세요.
Nuxt 모듈은 광범위한 기능을 제공하지만, 때로는 특정 Vite 플러그인이 더 직접적으로 요구를 충족시킬 수 있습니다.
먼저, Vite 플러그인을 설치해야 합니다. 예를 들어, @rollup/plugin-yaml
을 사용해 보겠습니다:
npm install @rollup/plugin-yaml
다음으로, 플러그인을 가져와서 nuxt.config.ts
파일에 추가해야 합니다:
nuxt.config.ts
import yaml from '@rollup/plugin-yaml'
export default defineNuxtConfig({
vite: {
plugins: [
yaml()
]
}
})
이제 Vite 플러그인을 설치하고 구성했으므로, 프로젝트에서 YAML 파일을 직접 사용할 수 있습니다.
예를 들어, 설정 데이터를 저장하는 config.yaml
파일을 만들고 이 데이터를 Nuxt 컴포넌트에서 가져올 수 있습니다:
greeting: "Hello, Nuxt with Vite!"
※이 페이지는 Nuxt.js 공식 문서의 비공식 번역 페이지입니다.
공식 문서의 해당 페이지는 여기 있습니다:
https://nuxt.com/docs/3.x/guide/recipes/vite-plugin