Vue3项目开发——新闻发布管理系统（一）
文章目录
- 一、项目要实现的功能
- 二、项目用到的技术栈
- 三、项目创建
- 1、pnpm安装
- 2、创建项目
- 3、项目启动
- 四、项目配置
- 1、ESLint
- 2、Prettier
- 3、ESLint + Prettier 进行配置代码风格
- 3.1配置prettier
- 3.2vue组件名称多单词组成 （忽略index.vue）
- 3.3props解构（关闭）
- 4、husky
- 4.1husky配置
- 4.2 暂存区 eslint 校验
从今天开始，我们要开发一个Vue3项目——
新闻发布管理系统。
我会从零开始详细给大家介绍项目是怎么开发出来的，跟我学完之后，你一定也就熟练掌握了Vue开发的全过程。
让我们开始吧。
一、项目要实现的功能
新闻发布管理系统主要包括以下四部分功能：
1、登录和注册
2、新闻分类管理
3、新闻管理
4、个人信息（包括基本资料、更换头像、重置密码）
二、项目用到的技术栈
本项目技术栈基于 ES6、vue3、pinia、vue-router 、vite 、axios 和 element-plus。
结合开发过程，我们不仅会讲解：
- Vue3 compositionAPI
- Pinia / Pinia 持久化chuli
- Element Plus (表单校验、表单处理、组件封装)
这三个核心内容，同时也会介绍以下
- pnpm 包管理工具
- Eslint + prettier (进行更规范的配置)
- husky (Git hooks工具，代码提交前进行校验)
- 请求模块设计
- VueRouter4路由设计
这些知识。
三、项目创建
本项目创建使用pnpm工具。pnpm工具是一个速度快、节省磁盘空间的软件包管理器，它比npm快了近两倍，在磁盘空间的使用上也比