如何在新的 Nuxt 3 项目中安装 Vuex？

Question

我需要有人帮助我解释如何在 Nuxt 3 应用程序中安装 Vuex。

当我使用此命令安装 Nuxt 3 时npx nuxi init，我有一个新的 Nuxt 3 应用程序，但是当我想在 Nuxt 中使用 Vuex 时，我不能，因为默认情况下它没有安装在新的 Nuxt 3 应用程序中。
所以我想我需要使用“npm i vuex”安装它，好吧，我知道这很容易，但对我来说却不是。
我需要有人准确地向我解释如何让它发挥作用。

互联网上没有关于如何在新的 Nuxt 3 应用程序中设置 Vuex 的文档。
如果有人可以向我发送一个由 Nuxt 3 应用程序安装的简单项目npx nuxi init或在此处提供代码，我将了解其原因等...

Answer 1

首先，检查 Pinia 和 Nuxt 状态管理。

Pinia： Pinia 是 Vue 的存储库，它允许您跨组件/页面共享状态。

Pinia 现在是新的默认值

Vue 的官方状态管理库已更改为 Pinia。Pinia 具有与 Vuex 5 几乎完全相同或增强的 API，如 Vuex 5 RFC 中所述。您可以简单地将 Pinia 视为具有不同名称的 Vuex 5。Pinia 也可以与 Vue 2.x 配合使用。

Vuex 3 和 4 仍将得到维护。然而，它不太可能为其添加新功能。Vuex 和 Pinia 可以安装在同一个项目中。如果您要将现有的 Vuex 应用程序迁移到 Pinia，它可能是一个合适的选择。但是，如果您计划开始一个新项目，我们强烈建议您使用 Pinia。

Nuxt 状态管理：Nuxt 提供 useState 可组合项来创建跨组件的反应式且 SSR 友好的共享状态。

如何在 Nuxt3 中安装 Vuex

安装 nuxt3 后，您应该使用此命令来安装依赖项：

npm i

然后使用以下命令安装 Vuex：

npm install vuex@next --save

或者

yarn add vuex@next --save

取决于您的包管理器。

然后转到根项目并创建plugins\目录。

在插件内部创建vuex.js文件，然后在其中写入以下代码：

npm i

现在app.vue运行这些代码来检查它：

npm install vuex@next --save

概括

1. 安装依赖项
2. 安装vuex
3. 创建 vuex 插件