vue项目background-image引入背景图报错

之前写好的代码明明运行很正常，今天早上突然在预发环境挂掉了

[31mERROR in ./node_modules/extract-text-webpack-plugin/dist/loader.js?{"omit":1,"remove":true}!./node_modules/vue-style-loader!./node_modules/css-loader?{"sourceMap":false,"root":"C://Program Files (x86)//Jenkins//workspace//novice_region//front_page//src//assets"}!./node_modules/vue-loader/lib/style-compiler?{"vue":true,"id":"data-v-6fa1d485","scoped":true,"hasInlineConfig":false}!./node_modules/vue-loader/lib/selector.js?type=styles&index=0!./src/page/newStockDetail.vue
Module build Failed: ModuleNotFoundError: Module not found: Error: Can't resolve '../assets/ns_detail_bg.png' in 'C:\Program Files (x86)\Jenkins\workspace\novice_region\front_page\src\page'

怎么回事呢？
仔细排查后，本地运行正常，并不会出现这个问题，但是测试环境一直就是这个错误，有点懵逼。
没办法，只能仔细对比两个环境了。
仔细对比后发现配置都没有变动，那就看看版本吧，发现昨天vue版本升级了，导致了这个问题！
查阅资料后发现：
vue2.5及以下版本background-image： url('../assets/btn-bgc.png')这种写法没有问题,
但是2.6就会出现这个问题,和webpack配置相关 .vue2.6用的是webapack4.0导致
所以换一种写法就好background-image： url('~@/assets/btn-bgc.png')

关于webpack资源处理的规则,分为相对路径,没有前缀的路径,带~的路径,相对根目录的路径

1.相对路径: "./assets/logo_blue.png" 
2.没有前缀的路径 "assets/logo_blue.png" 被webpack解析为相对路径
3.带~的路径  "~@/assets/theme/logo_blue.png" 被webpack解析为 require(src/assets/theme/logo_blue.png) 动态引入 
@在webpack 被resolve.alias配置下等价于/src
4.相对根目录的路径 "/assets/logo_blue.png" webpack不解析