一、项目目录
二、目录解释
helloVue3/
├── node_modules/ #存放所有依赖包
├── public/ #静态资源文件夹
│ ├── vite.svg #网站图标
├── src/
│ ├── assets/ #放置静态资源，包括公共的 css 文件、 js 文件、iconfont 字体文件、img 图片文件 以及其他资源类文件。之所以强调是公共的 css 文件，是因为要在组件的 css 标签里加入 ‘scoped‘ 标记，将其作用范围限制在此组件以及调用它的父级组件中，避免污染全局样式。
│ │ └── logo.png #图标
│ ├── components/ #存放 vue 组件(通用模块组件)，避免重复工作,每个组件都是独立的.vue 文件
│ │ └── HelloWorld.vue
│ ├── views/ #存放视图组件
│ │ └── Home.vue
│ ├── App.vue #应用程序根组件，整个应用的入口点，通常包含路由视图和其他全局共享组件
│ ├── main.js #应用的入口文件，负责创建 Vue 实例并挂载到 DOM 上
│ ├── router/ #存放路由配置文件。
│ │ └── index.js #路由的配置文件，定义了应用的路由规则。
├── .gitignore
├── package.json #基础配置，告诉我们项目的信息（版本号、项目姓名、依赖）
├── README.md
├── index.html #单页面的入口，通过 webpack 的打包构建之后，会对 src 源码进行编译，最终把它们插入到 html 里面来。
├── vue.config.js #Vue CLI 的配置文件，用于修改默认配置。
└── yarn.lock or package-lock.json #锁定安装的依赖版本，确保项目依赖的一致性。
三、怎么生成目录树？
1、安装wsl
WSL，即Windows Subsystem for Linux，是Windows 10中的一个功能强大的子系统，它允许用户在Windows环境中直接运行Linux操作系统和应用程序。这意味着，无需设置复杂的虚拟机或进行双系统启动，开发人员和用户就可以在Windows上使用Linux的各种命令行工具、实用程序和应用。
2、安装tree
- 启用wsl：在中断输入
wsl即可启用环境 - sudo下载：
sudo apt-get install tree
3、使用tree自动生成目录结构
- 进入你需要生成目录结构文件夹，输入：
tree - 控制打印目录的深度，加上参数
-L，输入：tree -L [level](level取值1、2、3……) - 如果你需要将内容写入Markdown文件中，输入：
tree -L [level] > output.md
