Examples · Nuxt Kit

访问 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)

Builder

Nuxt Kit 提供了一系列工具，帮助你使用构建器。这些函数允许你扩展 webpack 和 vite 的配置。

生命周期钩子

Nuxt 提供了一个强大的钩子系统，可以使用钩子来扩展几乎所有方面。