Vue3打包发布,刷新出现的空白页面和错误

Vue3打包发布出现的错误：Failed to load module script: Expected a JavaScript module script but the server responded with a MIME type of text/html. Strict MIME type checking is enforced for module scripts per HTML spec.

第一次点击访问到这个路径：页面正常：

刷新这个页面，页面空白，点到错误上面显示文件的访问路径有问题

Vite.config.ts:这个配置base:‘/’

打包以后的index.html:

打包以后的index.html文件会自动在script和link的标签上加上./访问，这就是导致页面刷新出不来的原因

解决方案：base去掉‘.‘,因为我发布项目是在根目录下

Index.html打包之后的路径：

以下是base：'./ ' 和base：'/' 的区别：

base：'./'：

1. 这意味着你的项目将以相对路径作为基础路径。
2. 当你的项目部署在网站的子目录时，使用’./’是很有用的。例如，如果你的应用部署在https://example.com/my-app/，那么资源（如脚本、样式表、图片等）的路径将会相对于 my-app/ 目录。
3. 使用相对路径可以避免一些路径问题，特别是当你需要在本地打开HTML文件而不是通过服务器时。

base：'/'：

1. 这意味着你的项目将以根路径作为基础路径。
2. 当你的项目部署在域的根目录时，使用 ‘ / ‘ 是合适的。例如，如果你的应用部署在 https://example.com/，那么资源将会从根目录加载。
3. 如果你的项目部署在子目录中，但这里配置了 /，那么资源路径可能会出错，因为它们会相对于根目录而不是子目录。
4. 因此，选择哪种路径取决于你的项目是如何部署的。如果你不确定项目将来会在哪里部署，或者如果你需要在本地和服务器上都可以正常工作，通常建议使用 base: './'。但是，如果你确定项目将始终部署在网站的根目录，那么使用 base: '/' 是安全的。记得根据实际部署情况调整这个配置。