Vite项目部署页面白屏问题

先说背景，我的是Vue3+Vite，部署是使用的nginx+Docker直接部署的。之前别的项目到也没遇到什么问题，但是上一个项目就发现了一个问题，我的项目在PC访问正常，但是在一些平板设备上访问一直白屏。刚开始我一直是以为设备兼容还是nginx配置的问题。就建议客户装个Chrome来解决。今天我有时间了，就想着抓日志看看到底是咋回事。

使用VConsole判断

npm i console，在项目中在引用以后，电脑访问正常，啥问题也没有，移动端首屏无反应。VConsole也没加载出来，还是白屏。没办法，直接在build的html文件中手动引入cdn，VConsole出来了，但是无任何反应。那也基本验证了我的想法，差不多就是js引入失败了。

查看容器nginx的访问日志

在查看日志后，发现和想的验证属实。正常PC请求会有好几个请求（HTTP请求、css请求、js请求，首屏的一些数据渲染请求什么的）但是移动端只有一个favicon.ico的请求，没有js、css这些请求。

进一步判断

在确认了问题出在这里，接下来要定位问题的原因。 1、直接在PC访问css、js地址。正常 2、在平板设备访问白屏，查看nginx日志，发现请求的地址出现问题且报错(111: Connection refused) while connecting to upstream。

找到了问题就比较好解决了。接下来对比一下。 我发现在PC端正常请求的url地址是：https://xxxx.com/index-5b5e8430.js 而在移动端的请求url地址会对请求的-进行转义，比如上面的链接就会变成类似这样的https://xxxx.com/index%E2%80%5b5e8430.js。 突然就有点懵逼，我之前的项目也没遇到这种问题呀。于是就去翻看前面的项目，发现在打包这里有点问题。我之前用的vite build，而这次顺手了，就用了npm run build，讲道理应该也是一样的。（如果有知道的朋友，欢迎赐教。）

那知道问题了，那就切换回vite build吧，结果又出问题了。执行后又提示Missing "./preload-helper" export in "vite" package,详细报错如下

[vite:resolve] Missing "./preload-helper" export in "vite" package
error during build:
Error: Missing "./preload-helper" export in "vite" package
    at bail (/usr/local/lib/node_modules/vite/dist/node/chunks/dep-c9998dc6.js:38597:8)
    at resolve (/usr/local/lib/node_modules/vite/dist/node/chunks/dep-c9998dc6.js:38674:10)
    at resolveExports (/usr/local/lib/node_modules/vite/dist/node/chunks/dep-c9998dc6.js:40982:12)
    at resolveDeepImport (/usr/local/lib/node_modules/vite/dist/node/chunks/dep-c9998dc6.js:41000:31)
    at tryNodeResolve (/usr/local/lib/node_modules/vite/dist/node/chunks/dep-c9998dc6.js:40773:20)
    at Object.resolveId (/usr/local/lib/node_modules/vite/dist/node/chunks/dep-c9998dc6.js:40581:28)
    at /usr/local/lib/node_modules/vite/node_modules/rollup/dist/shared/rollup.js:22870:37

我也是吐血了，看下面的报错明细，基本错误都出在dep-c9998dc6.js这个文件中，那就点进去。然后搜索vite/preload-helper,在38274行有这样的代码

const preloadHelperId = 'vite/preload-helper';

通过网上查询资料，改成下面这样就可以。

const preloadHelperId = '\0vite/preload-helper';

然后在执行vite build打包，这次打包后，可以发现文件的连接符就会从之前的-变成.了。