@pinia/nuxt
用于 Pinia 的 Nuxt 模块
自动安装
使用 nuxi 将此模块自动添加到您的 Nuxt 项目中
npx nuxi@latest module add pinia
手动安装
将依赖项添加到您的 Nuxt 项目中
npm i pinia @pinia/nuxt
在 nuxt.config.ts 中启用 @pinia/nuxt 模块
export default defineNuxtConfig({
modules: ['@pinia/nuxt'],
})
配置模块
默认情况下,此模块会将 stores 文件夹添加到自动导入中,您可以在其中统一组织与 Pinia store 相关的代码。
!提示 在 Nuxt 4 引入的新目录结构中,该目录为
app/stores。
您可以在 nuxt.config.ts 中使用 pinia 属性来自定义此行为
export default defineNuxtConfig({
modules: ['@pinia/nuxt'],
// configure the module using `pinia` property
pinia: {
/**
* Automatically add stores dirs to the auto imports. This is the same as
* directly adding the dirs to the `imports.dirs` option. If you want to
* also import nested stores, you can use the glob pattern `./stores/**`
* (on Nuxt 3) or `app/stores/**` (on Nuxt 4+)
*
* @default `['stores']`
*/
storesDirs: []
}
})