vue3项目实战-创建，基础配置，路由设置，页面静态结构搭建

项目创建

由于我昨天进行了git的安装与配置，导致命令行几乎是崩溃的，在这里我重新安装了node环境，最新的版本是20.0的，虽然版本有点高，但不影响使用

可以采用如下代码来创建项目，

npm init vue@latest

这些配置项需要根据自己的需求来选择

完成之后，需要安装一些基本的配置

直接运行在控制台提示的代码即可，完成之后，启动项目即可。

目录调整

在src目录下新增以下文件夹：

1utils：存放一些通用的工具函数、常量或者配置信息

2styles：存放全局样式文件

3apis,存放API接口文档

4directives：存放全局指令的文件夹

5composables:存放组合函数或通用的逻辑函数的文件夹

调整之后，整个项目的目录如下所示：

完成之后，通过git进行管理

Element-Plus组件按需引入

项目中的组件分为两种，

1通用型组件（Element-plus）dialog模态框，在任何时候都可以使用

2业务定制化组件（手写）如 商品热榜组件，在特定的页面中进行渲染使用

在这里，我们使用到的组件库是element,在使用之前需要先导入，具体怎么导入呢？

首先，我们来到官网，一个 Vue 3 UI 框架 | Element Plus