webpack打包后上传服务器页面空白

某天同事小白使用了webpack开发vue项目,在项目开发完成后,使用命令:npm run build对项目进行打包后发布服务器页面显示空白

排查后发现:webpack打包的时候引入js时使用的是绝对路径导致的

解决方案如下

修改webpack打包文件中的配置:

  • webpack.prod.conf.js 中增加publicPath:'./'
  • util.js 中增加publicPath:'./';(可选用或不用)
  • config/index.js 修改assetsPublicPath:'./';
相关推荐
DEMO派几秒前
Web 视频录制方案解析,轻松实现录屏!
前端·javascript·音视频
1024小神9 分钟前
css主题theme变量切换实现原理学习记录
前端·css·学习
wuhen_n10 分钟前
TypeScript工作流深度解析:从.ts到.js发生了什么?
前端·javascript·typescript
小二·25 分钟前
Python Web 开发进阶实战:时空数据引擎 —— 在 Flask + Vue 中构建实时地理围栏与轨迹分析系统
前端·python·flask
Hao_Harrision27 分钟前
50天50个小项目 (React19 + Tailwindcss V4) ✨ | TodoList(代办事项组件)
前端·typescript·react·tailwindcss·vite7
小二·27 分钟前
Python Web 开发进阶实战:可验证网络 —— 在 Flask + Vue 中实现去中心化身份(DID)与零知识证明(ZKP)认证
前端·网络·python
运筹vivo@31 分钟前
攻防世界:Web_php_include
前端·web安全·php
囊中之锥.44 分钟前
从分词到词云:基于 TF-IDF 的中文关键词提取实践
前端·tf-idf·easyui
小二·1 小时前
Python Web 开发进阶实战:生物启发计算 —— 在 Flask + Vue 中实现蚁群优化与人工免疫系统
前端·python·flask
局外人LZ1 小时前
Forge:web端与 Node.js 安全开发中的加密与网络通信工具集,支持哈希、对称 / 非对称加密及 TLS 实现
前端·安全·node.js