轻量级状态管理库 Pinia 的实践与教学演示项目

一、什么是 Pinia

Pinia 是下一代的轻量级状态管理库，拥有以下优点（官网：https://pinia.esm.dev/）：

• 完整的TypeScript 支持
• 完整的类型标支持
• 极其轻巧，体积约1KB
• Store中的Actions 配置项可以执行同步或异步方法
• 模块不需要嵌套，可以声明多个Store
• 支持Vue DevTools， SSR和Webpack 代码拆分

可能会有小伙伴问，我们不是已经有了 Vuex 了吗为什么还要一个新的框架？那么接下来我们来看看Vuex的缺点：

并且我们再瞅一眼 Vuex5 的 Rfcs 提案：https://github.com/vuejs/rfcs/pull/271

翻译过来就是：

1. 支持 options api 和 composition api
2. 没有 mutations，只有 state, getters, and actions
3. 没有嵌套的模块
4. 更好 typescript 支持
5. 自动化的代码差分

我们会发现 Pinia 与 Vuex5 的提案内容极其符合，并且Pinia的作者是 Vuex 核心开发人员之一，诶嘿~这不巧了吗。尤大在前阵子的《前端早早聊》中也提到了 Pinia，所以现在学习 Pinia 相当于提前学习了 Vuex5 还是非常值得的。

为了学习 Pinia，我写了个教学演示的开源项目来进行展示，具体如下：
（地址：https://gitee.com/MTrun/pinia-demonstration）

gif为：

此项目已经开源在了码云https://gitee.com/MTrun/pinia-demonstration上，源码部分参考了掘金上的部分文章，如果小伙伴有兴趣，可以一起来参与建设~