vue3+ts+pinia+vite一次性全搞懂

已于 2023-04-23 17:22:18 修改
阅读量1.6k 收藏 3
点赞数
分类专栏： vue 文章标签： vue.js javascript 前端
于 2023-04-21 11:20:33 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_45018844/article/details/130245601
版权
本文详细介绍了如何从零开始搭建一个基于Vue3、TypeScript和Pinia的项目，包括创建Vue3+TS项目、安装依赖、理解并使用Pinia状态管理库以及TypeScript的基础知识如类型和枚举。同时，文中还展示了如何在页面中使用Pinia以及修改其状态，以及在项目中应用TypeScript的实例。
摘要由CSDN通过智能技术生成

vue3+ts+pinia+vite项目

一：新建一个vue3+ts的项目

前提是所处vue环境为vue3，如果失败就查看一下环境是否为vue2，然后删除vue2，安装vue3
这是我报过的错

vue create is a Vue CLI 3 only command and you are using Vue CLI 2.9.6.   You may want to run the fo

需要卸载+重装vue3的环境

npm uninstall -g vue-cli
npm install -g @vue/cli

vue create <项目名
了解本专栏 订阅专栏 解锁全文 超级会员免费看
小莉爱编程
关注
专栏目录
订阅专栏
vue3+TS+Pinia+Vite项目实战之一
weixin_42710036的博客
04-08 2033
vue3+TS+Pinia+Vite项目实战
Vue3+TS+Vite+Pinia 搭建项目
weixin_45478649的博客
10-12 427
Vue3项目集成了许多需要用到的技术的配置教学！
Vue3、Vite、Pinia基础学习
最新发布
qq_63898506的博客
08-27 1680
Vue3、Vite、Pinia基础学习，本次学习是跟着邓瑞编程b站视频进行学习的。
vue3：vue3+vite+ts+pinia
snowball的博客
09-09 6156
输入名字后，这里出现了几个选项，不清楚都是干啥的，下来研究。经过测试不需要安装sass-loader，安装了会报错。查看url已经有参数了，，查看查询结果，生效，ok。参数要一致，不一致就会报错。问题得到处理，不报错了。
vue3+ ts +vite pinia相关总结
qq_42152032的博客
10-14 1383
监听ractive复杂对象类型 ：wacth小括号，监听的对象逗号箭头函数，箭头函数中有两个值，new，old，在箭头函数对象中可以直接打印，如果要开启深度监听，在箭头函数后面加逗号，逗号后面是对象，对象中开启deep：true。总结：vue3 wacth后是一个小括号，在小括号中操作，如果要监听ref单个的值，监听的值逗号箭头函数，箭头函数里面有两个形参，new，old，可以在对象中直接打印，监听多个值，可以在监听值的地方使用数组，多个值以逗号分隔。使用此选项可强制预构建链接的包。
vue3+ts+vite实现pinia
weixin_45441173的博客
06-12 803
安装持久化 cnpm install pinia-plugin-persistedstate。安装pinia : cnpm install pinia。1.单文件: index.ts (先不要管user.ts)main.js引入pinia持久化。运行结果（我没运行修改的方法）3.pinia数据持久化。本篇文章主要从事3部分。在index.js引入。
搭建vue3+ts+vite+pinia框架
weixin_51862533的博客
01-30 1540
创建vue3+ts+vite+element+pinia项目
Vue3+TS+Vite+Pinia最全总结
前端开发工程师
02-02 1444
Vue 3 是一个流行的开源Java框架，用于构建用户界面和单页面应用。它带来了许多新特性和改进，包括更好的性能、更小的打包大小、更好的Type支持、全新的组合式 API，以及一些新的内置组件。
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+...
vue3+ts+vite+pinia 后台通用管理系统.zip
01-03
Vue3，springboot，element-ui使用技巧，实战应用开发小系统参考资料，源码参考。 详细介绍了一些Qt框架的各种功能和模块，以及如何使用Qt进行GUI开发、网络编程和跨平台应用开发等。 适用于初学者和有经验的开发者...
Vue3+Vite+Ts+Pinia+....一个快速开发vue3的模板框架，快速搭建前台应用.zip
02-08
Vue3+Vite+Ts+Pinia的组合能够满足这些需求，提供高性能、可扩展和易于维护的解决方案。Vue3的Composition API有助于组织复杂业务逻辑，TypeScript保证了代码质量，而Vite和Pinia则优化了开发流程。 【快速开发】 ...
uniapp + vue3 +vite + ts + pinia 框架模板
01-31
标题 "uniapp + vue3 + vite + ts + pinia 框架模板" 提供了我们讨论的关键技术栈。这是一个基于uni-app、Vue.js 3、vite、TypeScript和Pinia的项目模板，用于构建移动端应用。让我们逐一探讨这些技术的特性与它们在...
Vue3使用pinia的配置教程详解
qq_38682174的博客
09-23 1493
最近官方推出来一个最新的vuex版本,也算是vuex5的版本吧,为了尊重这个版本的原作者,所起名字为pinia. 比起之前的版本使用起来简单方便,而且模块化更加清晰,维护成本更低,所以更推荐大家使用pinia状态管理
从0开始搭建vue3+vite+ts+pinia项目
不求甚解的博客
06-05 3152
注意：直接使用环境变量会提示变量未声明，需要在 env.d.ts 或 vite-env.d.ts 文件中添加类型声明。，没有显示局域网ip地址，不方便局域网真机调试，需要配置启动host为0.0.0.0。配置.vscode/setting.json，自动校验eslint并修复。封装axios方法，新建/src/utils/request.ts文件。在项目代码中使用，比如main.ts / index.vue。3、在/src/store/目录下新建user.ts。打开vite.config.ts。
搭建vue3.2+vite+ts+pinia项目
小菜张的博客
11-24 2928
搭建vite+vue3.2+ts+pinia 项目
vue3+TS+vite+pinia
qq_44829351的博客
01-20 981
Vue3+TS+vite+pinia项目创建
vue3+ts+pinia+vite知识分享
weixin_45803033的博客
06-13 750
在中 声明emit，必须使用API，这也是一个宏命令。同样可采用普通写法和类型声明式，在类型声明下emit将具备完美的类型推断。counter?emit('handleClick' , props . counter + 1) } < / script > < template > < div > < button @ click = "handlerClick" > 点了 {props . counter } } 次 < / button > < / div > < / template >?
从0开始搭建一个vue3+vite+ts+pinia+element-plus的项目
qq_45780736的博客
03-09 4657
自学搭建vue3+ts+vite+pinia+element-plus项目
vue3+ts+vite+pinia 项目搭建
m0_54850825的博客
03-06 492
1. 起始，项目搭建 yarn 创建项目 yarn create vite pnpm 安装依赖（如果没有可以用npm） // mac安装pnpm sudo npm i -g yarn // 安装依赖 pnpm i //启动项目 yarn dev //安装一下pretter和eslint pnpm i prettier eslint eslint-config-prettier eslint-plugin-prettier eslint-plugin-vue vue-eslint-parser @types
vite+vue3+ts+naiveUI+pinia+echarts
10-19
vite+vue3+ts+naiveUI+pinia+echarts是一个基于Vue3生态的前端技术栈，其中vite是一个快速的构建工具，Vue3是一个流行的JavaScript框架，TypeScript是一种类型安全的JavaScript超集，NaiveUI是一个基于Vue3的UI组件库，Pinia是一个Vue3状态管理库，Echarts是一个流行的数据可视化库。这个技术栈可以帮助开发者快速构建现代化的Web应用程序，并且具有良好的可维护性和可扩展性。
评论 2
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

小莉爱编程

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值