[解决]在 Vue 3 使用 Vite 开发的项目中，放在 public 文件夹里的文件，在打包部署后出现 404 的问题

这通常是因为在 Vite 的配置或者构建过程中，这些文件没有被正确处理。public 文件夹在 Vite 项目中扮演着静态资源托管的角色，但需要注意一些特定的配置和操作步骤来确保这些文件能够被正确访问。

解决方案

1. 确认文件路径

首先确保你的静态文件（如图片、字体文件等）放在了 public 文件夹内，并且路径是正确的。例如，如果你有一个 public/logo.png 文件，你应该在代码中通过相对路径或绝对路径（使用 / 开头）来引用它，如：

<img src="/logo.png" alt="Logo">

2. 检查 Vite 配置 （一般到这一步已经解决）

Vite 默认会将 public 目录下的文件作为静态资源处理。通常，这应该自动工作，但你可以通过检查 vite.config.js 文件来确认是否有任何特定的配置可能影响到了这一行为。例如，如果你使用了别名或者修改了静态资源的处理方式，这可能会影响到 public 目录下的文件。

// vite.config.jsexport default defineConfig({// 其他配置...publicPath: './', // 确保 base 路径设置正确，注意 base 已被 publicPath 替换
});

3. 清除缓存和重新构建

有时候，简单的重新构建项目和清除缓存可以解决问题。你可以尝试以下步骤：

• 停止 Vite 服务器（如果正在运行）。

• 清除项目的 node_modules 和 dist 目录（如果有的话）。

• 重新安装依赖：npm install 或 yarn。

• 重新构建项目：npm run build 或 yarn build。

• 重新启动 Vite 服务器（如果你需要本地预览）：npm run dev 或 yarn dev。