如何解决vue打包项目中的图片,静态css,js 不能访问路径问题

1.在书写代码的时候按照相对路径引入；但是webpack+vue-cli 默认打包的css,js 等资源的路径是绝对的；实际写的代码<template> <div> <div class=“logo”></div> <img src="../assets/images/logo.png" alt=""> </div></template><script>export default { }</script><style scoped> .logo { width: 200px; height: 200px; background: url(../assets/images/logo.png) center center; }</style>3.webpack 打包编译后的路径是这样的；打包编译之后的路径是绝对路径；当部署到带有文件夹的项目中就会报错，因为把配置的static 文件当成了根路径；解决办法： 引入相对路径；打开build/webpack.prod.conf.jsoutput: { path: config.build.assetsRoot, filename: utils.assetsPath(‘js/[name].[chunkhash].js’), chunkFilename: utils.assetsPath(‘js/[id].[chunkhash].js’), publicPath: ‘./’ },4.执行打包命令，发现解决了css,js img图片的路径问题，但是没有解决背景图片的路径问题，下面我们解决背景图片的问题修改build/utils.jsif (options.extract) { return ExtractTextPlugin.extract({ use: loaders, fallback: ‘vue-style-loader’, publicPath: ‘../../’ }) } else { return [‘vue-style-loader’].concat(loaders) }再次执行打包命令，发现完美解决问题；职场小白south Joe，望各位大神批评指正，祝大家学习愉快！