项目实操后台管理系统

大前端时代：统一=?前端=>和用户直接交互的=>产生数据=>网络请求方式http/socket=>后端:java/GO/Python/Node...=>数据库：MySQL/Oracle/MongoDB...=>展示到前端（后台管理系统<增删改查>增加、删除、修改、查询数据）

　　　　　　1、前端。

　　　　　　2、移动端ios/android开发。

　　　　　　3、桌面端window/Mac *VSCode=>electron=>跨平台=>Mac/window/Linux。

　　　　　　4、其他平台：穿戴设备/车载系统（智能汽车）/VR（虚拟现实）/AR（增强现实）...

　　　　　　5、Web3方向

一、技术栈介绍：

开发工具：Visual Studio Code
编程语言：TypeScript 4.x + JavaScript
构建工具：Vite 3.x（我们用这个）/ Webpack5.x
前端框架：Vue 3.x + setup
路由工具：Vue Router 4.x
状态管理：Vuex 4.x/ Pinia(我们用这个)
UI 框架：
- - Element Plus（目前流行）
  - 、AntDesign/MaterialUI=>React UI组件库=>阿里（蚂蚁金服）移动端版本：AntDesign Mobile版本官方没有Vue版本：AntDesignVue 目前支持Vue3
可视化：Echart5.x
工具库：@vueuse/core + dayjs + countup.js 等等
CSS 预编译：Sass / Less
HTTP 工具：Axios
Git Hook 工具：husky（小公司用不到）
代码规范：EditorConfig + Prettier + ESLint
提交规范：Commitizen + Commitlint（小公司用不到）
自动部署：Centos + Jenkins + Nginx

二、方式一：Vue CLI

基于webpack工具；

　　命令：vue create

　　方式二：create-vue（目前用这个）

　　基于vite工具；

　　命令：npm create vue@latest

　　快速上手 | Vue.js

首先检查一下node--version版本

然后打开目录，右键，点击 Open Git Bash here

会跳出窗口，我们输入

npm init vue@latest

会弹出

　　这是在命令行中初始化 Vue 项目时的提示信息。命令 npm init vue@latest 用于创建一个最新版本的 Vue 项目。提示 “Need to install the following packages: create-vue@3.15.1” 表示需要安装 create-vue 这个包，版本为 3.15.1 。“ok to proceed? (y)” 是询问是否继续操作，输入 y 并回车就会开始安装相关的包来创建 Vue 项目。

这里我们输入y，会出现这个

　　这是在命令行中创建 Vue 项目的过程。npm init vue@latest 命令用于初始化一个最新版本的 Vue 项目，系统提示需要安装 create-vue@3.15.1 包，输入 y 确认继续。

　　接着，npx create-vue 开始执行创建操作，出现 “Vue.js - The Progressive JavaScript Framework” 说明这是 Vue 框架的创建引导。“请输入项目名称：” 是让你为即将创建的 Vue 项目命名，当前示例中输入的是 vue-project ，输入后回车即可继续后续创建步骤。

　　Vue.js - The Progressive JavaScript Framework

　　Vue.js是一个渐进式的一个框架

　　这里我们起名字 vue3_ts_cms

　　　（content manager system 内容管理系统）