vue 打包出现的空白屏幕 资源无法正常加载问题

你可以在dist index 中看到这样一行字 We're sorry but xxxxxxx doesn't work properly without JavaScript enabled.

大概率是：

1. 在vue.config.js里面添加 pubilcPath:'./' （注意这里用相对路径 的./ 而不是绝对路径）

2. 将路由变成hash模式

原因：vue路由分为history模式和hash模式 而你在新建vue项目的时候选择默认的history模式

所以当你在执行npm run build之后 没有公共路径所以无法正常加载 截图中的process.env.Base_URL也可换成'./'

如果你就是想要history模式 在本地浏览器 也可以使用./但是部分资源无法正常加载

tips：history修改路径使用putstate

深入理解请见： https://blog.csdn.net/muzidigbig/article/details/121892336?ops_request_misc=&request_id=&biz_id=102&utm_term=history%E5%92%8Chash%E6%A8%A1%E5%BC%8F%E7%9A%84%E6%89%93%E5%8C%85%E5%8C%BA%E5%88%AB&utm_medium=distribute.pc_search_result.none-task-blog-2~all~sobaiduweb~default-0-121892336.142^v73^control_1,201^v4^add_ask,239^v2^insert_chatgpt&spm=1018.2226.3001.4187