当前位置: 首页 > news >正文

npm webpack打包缓存 导致css引用地址未更新

问题如下:

测试环境配置:

  publicPath: '/chat/',

生产环境配置:

  publicPath: '/',

css中引用背景图片

background-image: url('@/assets/images/calendar/arrow-left.png');

先打包测试环境,观察打包后的css文件引用的背景图片地址

可以全局搜索/dist/assets字符串判断

在这里插入图片描述

再打包生产环境,观察打包后的css文件引用的背景图片地址
在这里插入图片描述

发现背景图片的地址并没有变为/dist/assets/**依然是/chat/dist/assets/**,最终生产包发布后出现背景图片异常的问题。

解决办法

此问题是因为打包缓存导致,在webpack配置中关闭缓存即可,虽然打包慢一点,但是确保包是没有问题的。
修改webpack.prod.config.js

注意区分开发环境和打包环境的配置文件,开发环境关闭缓存后热更新非常慢!!!

module.exports = {
  cache: false,
  // ...config
};

再次打包,即可正常。
在这里插入图片描述

相关文章:

  • C++ 结构体与函数
  • Java基础知识总结(1.8)——Java 注解(持续更新)
  • CSS 父类元素的伪类 选择器
  • FME 中使用 DeepSeek API 与 天地图API
  • 使用perf工具分析Linux系统的性能瓶颈
  • 如何轻松查看安卓手机内存,让手机更流畅
  • (转)子网掩码的作用(1)
  • 期刊 | 不收版面费与审稿费的电子通信类期刊
  • R语言操作练习
  • windows服务器切换到linux服务器踩坑点
  • 树莓派超全系列文档--(17)树莓派配置显示器
  • 蓝桥杯 python 研究生组 备战刷题
  • PhotoShop学习03
  • Android 中获取颜色资源
  • Buzz1.2.0视频语音转成TXT、SRT、VTT工具
  • Python数据可视化-第4章-图表样式的美化
  • SQL INSERT INTO 语句详解
  • Linux编译安装mysql5.7.44 笔记250330
  • win 远程 ubuntu 服务器 安装图形界面
  • Spring Boot 支持哪些日志框架?推荐和默认的日志框架是哪个?
  • 如何做网站推广 求指点/最新热点新闻事件素材
  • 东营 网站建设/2021关键词搜索排行
  • 临沂网站建设/北京网络优化推广公司
  • 直播类网站开发/百度网站排名查询工具
  • 广西网站建设营销公司/百度极速版推广
  • wordpress oss/seo综合查询站长工具怎么用