vite中静态资源的处理

public目录

public 目录是存放静态资源的一种方式。

2.项目初始化时默认public作为静态资源服务的文件夹。我们可以在vite.config.js中修改publicDir。

3.该目录中的文件开发期间在 / 处提供，并在构建期间将public文件夹下的文件（不包含public本身）复制到outDir 的根目录。

4.public下的文件会被完整复制到目标目录的根目录下，保持原有文件名，不会被hash。

在开发时我们可以使用 / 开头直接访问public 目录下的资源。在vite项目中，运行的时候，其实是打包后的代码。所以，图片需要的是打包后的图片路径。

当项目部署在嵌套的公共路径下，我们需要指定 base 配置项，由 JS 引入的资源 URL，CSS 中的 url() 引用以及 .html 文件中引用的资源在构建过程中都会自动调整，以适配此选项。

上面的资源在构建后会变为

当访问过程中需要使用动态连接的 url 时，不能被自动调整，可以使用全局注入的 import.meta.env.BASE_URL 变量，它的值为公共基础路径。

assets文件夹

Vite 中，项目的静态资源文件（如图片、字体、样式表等）会在打包构建时被处理并放置在输出目录中。默认情况下，这些静态资源文件会被放置在输出目录的根目录下的 "assets" 文件夹中。输出目录的默认名称是 "dist"，但你可以在项目的配置文件中进行自定义设置。