vue-cli

1.vue-cli
Vue CLI是Vue.js的项目的一个开发工具，它是一个基于Vue.js进行快速开发的完整系统，提供：
1.1 通过 @vue/cli 实现的交互式的项目脚手架。
1.2 通过 @vue/cli + @vue/cli-service-global 实现的零配置原型开发。
1.3 一个运行时依赖 (@vue/cli-service)，该依赖：
1.3.1 可升级；
1.3.2 基于 webpack 构建，并带有合理的默认配置；
1.3.3 可以通过项目内的配置文件进行配置；
2.安装vue-cli

在cmd中输入vue ui打开如下页面可创建项目：

3.vite
3.1 搭建vite项目


3.2 单文件组件
一种类似 HTML 格式的文件来书写 Vue 组件，它被称为单文件组件，（.vue文件)组件可以扩展 HTML 元素，封装可重用的代码。
单文件组件是一种在Vue.js中使用的组件形式，它将模板、脚本和样式都封装在一个单独的文件中。这种组件形式使得代码更加模块化和可维护，提高了开发效率。
4.vue-router
登陆成功以后需要vue-router这个包用来跳转首页
安装cmd命令：npm install vue-router@4
Vue Router 是 Vue.js 的官方路由。路由在Vue.js中是用于设定访问路径，并将路径和组件映射起来。在传统的页面应用中，通常使用超链接来实现页面切换和跳转，而在vue-router的单页面应用中，则是路径之间的切换，即组件的切换。
5.网页布局
网络布局通常指的是对项目中的各种组件、路由等进行合理的排布和规划，以便于开发者能够更加高效地开发和管理项目。例如，可以使用Vue CLI提供的路由管理工具vue-router来实现页面的布局和跳转，使用Vue CLI提供的状态管理工具vuex来管理组件之间的状态等。
6.路由
在Vue CLI中，路由是用于实现页面之间切换和URL映射的一种机制。它允许开发者将特定的URL路径与相应的组件关联起来，当用户访问某个路径时，对应的组件就会被渲染到页面上。Vue CLI中的路由由vue-router插件提供，它与Vue.js核心深度集成。
7.pinia
Pinia 是 Vue 的存储库，用于跨组件/页面共享状态
8.状态管理机制
状态管理机制是一种用于管理应用程序中多个组件之间的共享状态的方法。
问题回答
9.和 Vue CLI 比 Vite 的优势是什么
与Vue CLI相比，Vite具有更快的开发环境搭建速度、更好的模块化预编译、更好的打包速度、更轻量级的工具、更快的启动速度以及更好的开发体验等优势。

10.路由的模式有几种，选择 createWebHashHistory 模式的好处？
WebHistory和HashHistory都是前端路由的实现方式，它们利用浏览器的特性来实现页面之间的跳转和切换。
WebHistory是基于浏览器的历史记录栈来实现的。当用户在应用程序中进行页面切换时，WebHistory会使用JavaScript的history对象来记录用户的浏览历史，并在浏览器的历史记录中生成相应的记录。当用户点击浏览器的后退或前进按钮时，WebHistory会根据历史记录栈的状态来控制页面的跳转。
HashHistory则是通过监听location对象的hash值变化事件来实现的。当用户在应用程序中进行页面切换时，HashHistory会在URL的hash部分添加相应的标识，表示当前页面的路径。当用户刷新页面或点击链接时，HashHistory会根据hash值的变化来控制页面的跳转。

11.私有路由和公有路由的区别是什么？
私有路由和公有路由的区别主要在于访问权限和范围。

实践登录页面

登陆后页面显示

菜单栏动态显示

退出按钮，退到登录界面