vite+vue3.0项目如何引入pinia

已于 2022-12-14 16:39:43 修改
阅读量365 收藏
点赞数
分类专栏： Vue3.0技术（持续更新中...） 文章标签： vue.js
于 2022-12-12 11:29:24 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_44162077/article/details/128284519
版权
本文介绍了如何在Vite搭建的Vue3.0项目中集成Pinia状态管理库，包括安装Pinia、创建store目录、定义store模块及使用方式。
摘要由CSDN通过智能技术生成

一、第一步安装pinia

npm install pinia --S-D

二、在项目下创建store文件夹，创建index.js和userInfo.js
三、index.js文件如图所示
在这里插入图片描述
四、创建一个自己的存储模块

在这里插入图片描述

五、使用方法
在这里插入图片描述

不断学习的码农
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
订阅专栏
vite从零搭建vue3全家桶+elementPlus
ICEBOUND47的博客
06-17 1746
目录1.vite 搭建项目安装node.js安装vscode构建项目2.整合路由3.整合element-plus4.整合axios5.整合less5.扩展工具包 1.vite 搭建项目 安装node.js node官方下载地址 Node 版本要求 需要 Node.js v8.9 或更高版本 (推荐 v10 以上)。你可以使用 n，nvm 或 nvm-windows 在同一台电脑中管理多个 Node 版本。 安装vscode 官方下载地址 vscode下载地址2 下载安装之后 打开vscode安装vetur
vite+vue3动态模块化导入并使用pinia
03-25
1. **配置Vite**：在`vite.config.js`中，我们需要配置Vue3和Pinia的插件，如`@vitejs/plugin-vue`和`vite-plugin-pinia`，确保这些插件能在项目中正常工作。 2. **创建Pinia Store**：在`src`目录下创建`stores`...
小白系列Vite-Vue3-TypeScript：005-配置状态管理器pinia
总得学点什么的博客
02-08 461
小白系列Vite-Vue3-TypeScript：005-配置状态管理器pinia
搭建vue3+vite+pinia项目步骤
最新发布
小破孩的博客
07-04 1031
搭建 vue3+vite+pinia 项目超详细步骤
vite及pinia
你还有我
02-14 619
Vite是一种全新的前端构建工具，可以把它理解为一个开箱即用的开发服务器 + 打包工具的组合，但是更轻更快。VIte的开发服务器比 Vue CLI 快 10-100 倍多框架支持Vite 一开始主要注重于 Vue 的单文件组件支持，但 2.0 基于之前的经验提供了一个更稳定灵活的内部架构，从而可以完全通过插件机制来支持任意框架。现在 Vite 提供官方的 Vue, React, Preact, Lit Element 项目模版vite官网。
electron+vue3全家桶+vite项目搭建【二】vite自动引入插件，按需引入element-plus
个人网站：https://www.longzipeng.online
03-31 2233
electron+vue3全家桶+vite项目搭建【二】vite自动引入插件，按需引入element-plus
基于vite+vue3+pinia+element-plus+ts后台管理系统源码+项目说明.zip
04-12
基于vite+vue3+pinia+element-plus+ts后台管理系统源码+项目说明.zip 基于vite+vue3+pinia+element-plus+ts后台管理系统源码+项目说明.zip 基于vite+vue3+pinia+element-plus+ts后台管理系统源码+项目说明.zip 基于...
vue3+ts+vuerouter+pinia+elementplus+ts环境模板搭建及vite打包优化
05-12
vue3+ts+vuerouter+pinia+elementplus+ts环境模板搭建及vite打包优化vue3+ts+vuerouter+pinia+elementplus+ts环境模板搭建及vite打包优化vue3+ts+vuerouter+pinia+elementplus+ts环境模板搭建及vite打包优化vue3+ts+...
uniapp + vue3 +vite + ts + pinia 框架模板
01-31
这是一个基于uni-app、Vue.js 3、vite、TypeScript和Pinia的项目模板，用于构建移动端应用。让我们逐一探讨这些技术的特性与它们在框架中的作用。 **uni-app** 是一个跨平台的开发框架，它允许开发者使用一套代码来...
vue3 _vite+pinia
qq_38210427的博客
04-19 275
4. setup是什么 ： 组合式 API来解决什么问题 : 使用 (data、computed、methods、watch) 组件选项来组织逻辑通常都很有效。然而，当我们的组件开始变得更大时，逻辑关注点的列表也会增长。尤其对于那些一开始没有编写这些组件的人来说，这会导致组件难以阅读和理解。
vue3+Ts使用pinia（vue-lic搭建项目）
weixin_45766506的博客
07-14 1436
vue3+ts+pinia
pinia的使用方式(一) 引入pinia到项目中
你的世界我做主
02-16 1365
一。构建项目 我使用的是Ts+npm+vue3+vite构建； 1.构建项目 执行命令选择vue项目 npm init vite@latest 2.添加pinia npm install pinia 3.引入pinia到项目中
Vue3--Vite和Pinia
qq_44930306的博客
11-02 4469
这里是vue3.0中pinia和vite的具体应用。
Vite+TS项目：论如何便捷的使用pinia
林恒的博客
07-07 795
这里给大家分享我在网上学习总结出来的一些知识，希望对大家有所帮助 pinia 介绍 vue新一代状态管理库，相当于vuex 特性 1.像定义components一样定义store 2.支持ts 3.去除mutations，只有state，getters，actions(支持同步异步) 4.轻量级(1kb) 5.vuex是要有主入口进行统一导入，pinia可以分模块导入 pina...
Vue3+Vite+Js项目搭建之八：pinia 使用
weixin_64684095的博客
03-30 289
【代码】Vue3+Vite+Js项目搭建之八：pinia 使用。
vue调试工具没有Pinia模块解决办法
weixin_51926913的博客
06-13 4694
【代码】vue调试工具没有Pinia模块解决办法。
vue3+vite+pinia项目搭建完整示例
demowyz的博客
09-28 355
vue3+vite+pinia项目搭建完整示例
vite 构建vue3 + ts项目，并引入pinia、sass等相关插件（不包含配置）
记录自己的学习和工作心得，欢迎交流。
08-04 154
vite 构建vue3 + ts项目，并引入pinia、sass等相关插件（不包含配置）
vite+vue3+js+vue-router+pinia+axios+element-plus
09-02
- *2* *3* [vite+vue3+ts+vue-router+pinia+axios+element-plus](https://blog.csdn.net/zy_080400/article/details/127125359)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值