开启掘金成长之旅！这是我参与「掘金日新计划 · 12 月更文挑战」的第12天，点击查看活动详情
Vite 工程的目录结构
1. 目录
-
node_modules：
本地依赖仓库-
npm install 时，如果不适用 global 选项，那么依赖都被下载到 node_modules 中
-
这个目录是 import from 导入依赖时，再内置库之后，首选访问的依赖库
-
这个库中的依赖，不是生产环境的依赖，它只用于 node 打包构建使用。
-
import from 没有问题，那么就一定能成功运行。
-
-
public目录：
是应用系统的静态资源目录，其中的内容将再构建后放置到应用的根目录下。-
文件中的内容一般是共享的静态资源。Vite 在构建时不对它进行处理。
-
在模板中引用这些资源时，可以直接以相对应用的根目录进行引用。
-
这个目录在旧版本中名称是 static。类似 express中的静态资源处理。
-
-
src目录：
应用程序源代码目录。-
源代码包括：
文件名 作用 main.js 该文件是被应用程序中唯一的HTML；index.html文件所引用的唯一 JS 脚本 .vue组件文件 组件的三大部分：脚本、模板、样式 .css样式文件 一般是应用程序中独立且共享的样式文件。比如基础样式、主样式 main.js文件将会被 Vite 编译打包成 index***.js 文件.vue组件会被 Vite 拆解并打包到 index.xxx.js与index.xxx.css 文件中.css样式文件会被 打包到 index.xxx.css文件中。在.vue 或者 main.js 可以使用 import 进行导入。不需要在 import 前加 @
-
-
assets 目录：
- 该目录中存放需要被 Vite 进行编译打包的静态资源。
- 该目录经过打包发布后，存放在应用的根目录下。在发布后的目录中，同时存放有 index.xxx.js和 index.xxx.css 两个文件
- 综上所述：其他的会有
router和store目录，分别用于路由和状态管理。- 其他用户自定义目录，可以作为应用程序源码：views/components/api/utils.....
src目录下的所有内容都会被 Vite 进行打包编译
2. 文件
- package.json:
npm 用于项目依赖及构建管理的配置文件 - vite.config.js:
Vite 在编译 Vue 相关组件及资源，并启动资源
