[vue] 怎么解决vue打包后静态资源图片失效的问题？

上面蛮多回答感觉像开玩笑似的，静态资源图片失效分几种情况。
1、确定线上环境是否在根路径上，配置资源根目录，vue-cli2 和 vue-cli3 字段不一致（assetsPublicPath 和 publicPath ），如果项目是根路径上，用'/'，'./'都行，如果是在'/hc'这个路径上，用'./' 相对路径（需history模式），也可以用'/hc/'。 在'/hc'路径上，如果需要本地和线上保持一致，可以用环境做判断设置不同的publicPath值。
2、确定静态文件放置的位置。
①、如果放在public/static，不经过webpack打包， 放在public 又分使用绝对路径和相对路径。
②、如果放在assets， 经过webpack打包， 使用的是相对路径
3、路径是否是动态的，如果是动态，需要用require() 引入。

个人简介

我是歌谣，欢迎和大家一起交流前后端知识。放弃很容易，
但坚持一定很酷。欢迎大家一起讨论

主目录

与歌谣一起通关前端面试题

[vue] 怎么解决vue打包后静态资源图片失效的问题？相关推荐

解决vue-cli 打包后静态资源路径不对的问题
解决vue-cli 打包后静态资源路径不对的问题参考文章: (1)解决vue-cli 打包后静态资源路径不对的问题 (2)https://www.cnblogs.com/sifo/p/1008399 ...
解决vue打包后静态资源路径错误的问题
vue项目完成的最后一步就是打包部署上线,但是打包部署的过程往往不是那么一帆风顺的,现将遇到问题和解决方案记录如下. 图片路径问题起因: 页面中引入资源的方式往往有如下几种 * HTML标签中直接引 ...
vue修改打包后静态资源路径
使用vue-cli生成的项目,打包方式是直接执行package.json里配置的脚本 npm run build// 这步其实是去执行build下的build.js脚本文件 node build/bu ...
vue项目打包部署-----解决打包后访问资源失败问题
vue项目打包部署-----解决打包后访问资源失败问题参考文章: (1)vue项目打包部署-----解决打包后访问资源失败问题 (2)https://www.cnblogs.com/ycsc/p/1 ...
Vue Cli 打包之后静态资源路径不对的解决方法
Vue Cli 打包之后静态资源路径不对的解决方法参考文章: (1)Vue Cli 打包之后静态资源路径不对的解决方法 (2)https://www.cnblogs.com/mengyouyouyo ...
vue 不生效打包样式_解决在vue项目中webpack打包后字体不生效的问题
最近在项目开发过程中遇到如下问题:开发环境中设置的字体样式使用webpack打包后到生产环境不生效.如图: 打开控制台查看元素样式,发现在开发环境的时候"微软雅黑"被解析成unic ...
vue-cli3.0 vue打包部署非根目录时，静态资源图片路径错误
项目中需要把应用部署在子路径下,所以就需要修改vue配置和NGINX配置以子路径为market为例.eg.http://localhost:8000/market/ 1.第一步修改vue.conf ...
[vue] 如何解决vue打包vendor过大的问题？
[vue] 如何解决vue打包vendor过大的问题? 1.在webpack.base.conf.js新增externals配置,表示不需要打包的文件,然后在index.html中通过CDN引入ext ...
[vue] 怎么解决vue动态设置img的src不生效的问题
[vue] 怎么解决vue动态设置img的src不生效的问题不是应该 require('@/assets/images/xxx.png') 这样吗??你这样多浪费资源啊 @chenqim 个人简介 ...

[vue] 怎么解决vue打包后静态资源图片失效的问题？

[vue] 怎么解决vue打包后静态资源图片失效的问题？

个人简介

主目录

[vue] 怎么解决vue打包后静态资源图片失效的问题？相关推荐

最新文章

热门文章