nuxt logo

ドキュメント翻訳(非公式)

Nuxt.js
Version:v3.17

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!"