範例 · Nuxt Kit - Nuxt 框架

存取 Nuxt Vite 設定

如果您正在建立一個需要存取 Nuxt 使用的執行階段 Vite 或 webpack 設定的整合，可以使用 Kit 工具來提取它。

一些已經這樣做的專案範例

以下是一個簡短的範例，說明您如何從專案中存取 Vite 設定；您可以實作類似的方法來取得 webpack 設定。

import { loadNuxt, buildNuxt } from '@nuxt/kit'

// https://github.com/nuxt/nuxt/issues/14534
async function getViteConfig() {
  const nuxt = await loadNuxt({ cwd: process.cwd(), dev: false, overrides: { ssr: false } })
  return new Promise((resolve, reject) => {
    nuxt.hook('vite:extendConfig', (config, { isClient }) => {
      if (isClient) {
        resolve(config)
        throw new Error('_stop_')
      }
    })
    buildNuxt(nuxt).catch((err) => {
      if (!err.toString().includes('_stop_')) {
        reject(err)
      }
    })
  }).finally(() => nuxt.close())
}

const viteConfig = await getViteConfig()
console.log(viteConfig)

建構器

Nuxt Kit 提供了一組工具來協助您使用建構器。這些函數允許您擴展 webpack 和 vite 設定。

生命週期鉤子

Nuxt 提供了一個強大的鉤子系統，可以使用鉤子擴展幾乎每個方面。