0
点赞
收藏
分享

微信扫一扫

Vue3项目从0-1项目(手把手教学)

独孤凌雪 2022-01-07 阅读 89

学完vue3之后一直感觉手痒痒想用vue3做项目,正好最近公司不是很忙,就以公司现开发项目为模板将公司项目升级3.0。

项目搭建

01. 搭建项目

选择自定义第三个

 选择125678(空格选中)回车确定

选择3 

 选择n

 选择less

 选择第三个 Standard config

 两个都选中

 选择第一个

 选择n

 到这里搭建就已经完成了

以上用户可根据自己喜好进行配置。新手建议跟随作者进行配置

完成之后可以先尝试运行项目

也可以使用npm run serve 我这边使用的是yarn

 

 

Vuex配置

完成了上面配置 接下里我们就进入到vuex的配置中

首先因为vuex的数据我们需要做持久化,所以首先下载vuex持久化插件

npm i vuex-persistedstate

yarn add vuex-persistedstate

 老规矩,还是分模块

src/store 文件夹下新建 modules 文件,在 modules 下新建 user.js 和 database.js

user.js

 

 database.js

 store/index.js

然后接下来在store的首页引入持久化插件进行使用

axios

接下来就到了封装axios

首先第一步还是需要下载axios

新建 src/utils/request.js 模块

// 1. 创建一个新的axios实例
// 2. 响应拦截器:2.1. 剥离无效数据  2.2. 处理token失效
// 3. 导出一个函数,调用当前的axsio实例发请求,返回值promise

 

 到这里我们Vue3的项目就已经基本上完成啦,下面就可以按照自己公司项目需求进行项目的路由的设计,如果这篇文章对您有所帮助,欢迎点赞收藏。

有什么问题点击下方链接提问

http://print.haihaina.cn/qr.jpg

 

 

举报

相关推荐

0 条评论