Vite构建时如何配置为dist中index.html的资源路径添加.前缀？

完全可以通过Vite配置实现这个需求，只需要修改Vite的base配置项即可：

1. 打开项目根目录下的vite.config.js（或vite.config.ts，根据项目使用的语言选择）
2. 在defineConfig的配置对象中添加base: './'，示例代码如下：

import { defineConfig } from 'vite'
// 这里根据你的项目框架引入对应插件，比如Vue、React等
import vue from '@vitejs/plugin-vue'

export default defineConfig({
  plugins: [vue()],
  base: './' // 核心配置，将资源路径设为相对当前HTML文件的路径
})

配置完成后重新执行构建命令（npm run build），你会发现dist目录下的index.html里，JS和CSS文件的路径开头都自动加上了.——比如原本的/assets/main.xxxx.css会变成./assets/main.xxxx.css，正好符合需求。

这个配置的本质是把Vite的基础路径设置为相对路径，确保资源引用基于当前HTML文件的位置，无论部署在什么环境下都能正确加载资源。

内容的提问来源于stack exchange，提问作者COOL