feat: 위키 저장소 초기 커밋
- CLAUDE.md 운영 규칙 - wiki/ 정리된 지식 페이지 (Nuxt + Claude Code) - raw/ 원본 자료 - reference/ Nuxt 4.x 공식 문서 Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
39
reference/4.api/5.kit/15.examples.md
Normal file
39
reference/4.api/5.kit/15.examples.md
Normal file
@@ -0,0 +1,39 @@
|
||||
---
|
||||
title: "Examples"
|
||||
description: Examples of Nuxt Kit utilities in use.
|
||||
---
|
||||
|
||||
## Accessing Nuxt Vite Config
|
||||
|
||||
If you are building an integration that needs access to the runtime Vite or webpack config that Nuxt uses, it is possible to extract this using Kit utilities.
|
||||
|
||||
Some examples of projects doing this already:
|
||||
|
||||
- [histoire](https://github.com/histoire-dev/histoire/blob/main/packages/histoire-plugin-nuxt/src/index.ts)
|
||||
- [nuxt-vitest](https://github.com/danielroe/nuxt-vitest/blob/main/packages/nuxt-vitest/src/config.ts)
|
||||
- [@storybook-vue/nuxt](https://github.com/storybook-vue/storybook-nuxt/blob/main/packages/storybook-nuxt/src/preset.ts)
|
||||
|
||||
Here is a brief example of how you might access the Vite config from a project; you could implement a similar approach to get the webpack configuration.
|
||||
|
||||
```js
|
||||
import { buildNuxt, loadNuxt } 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:extend', (config) => {
|
||||
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)
|
||||
```
|
||||
Reference in New Issue
Block a user