在 Nuxt 中使用 Vite 插件
了解如何将 Vite 插件集成到你的 Nuxt 项目中。
虽然 Nuxt 模块提供了丰富的功能，但有时某个特定的 Vite 插件可能更直接地满足你的需求。
首先，我们需要安装 Vite 插件，在本例中，我们将使用 @rollup/plugin-yaml：
npm install @rollup/plugin-yaml
yarn add @rollup/plugin-yaml
pnpm add @rollup/plugin-yaml
bun add @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!"
<script setup>
import config from '~/data/hello.yaml'
</script>
<template>
<h1>{{ config.greeting }}</h1>
</template>