vue-cli中打包图片路径错误的解决方法
2017-10-26 14:42
2046 查看
最近第一次使用vue-cli构建项目,第一次打包部署到服务器上的时候出现图片加载不出来,结合网上的方法,终于给摸索出来。将项目部署到服务器上分为两种:一种是直接部署到服务器的根目录,另外一种是部署到服务器的子目录下
1.我们首先来说部署到根目录下 就是比如:www.****.com
找到项目中config文件夹下的index.js文件
将文件中的assetsPublicPath: '/',改成如下方框这样。
这样的目的是将绝对路径改成相对路径
如果放在根目录下,这样就可以了
2.放在子目录下 如:www.***.com/community/dist
分为两步 第一步和上面的一样
如果你还用到路由的话,将router文件夹下的index文件,改成如下图这样
用npm run build命令打包完之后,就将dist文件放到community文件夹下,这样图片就可以显示出来了。
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。
您可能感兴趣的文章:
相关文章推荐
- vue的图片路径,和背景图片路径打包后错误解决
- vue-cli webpack模板项目搭建及打包时路径问题的解决方法
- 解决vue项目打包后提示图片文件路径错误的问题
- 解决Vue打包后背景图片路径错误问题
- 解决Vue打包后背景图片路径错误问题
- react打包后图片和资源路径错误的解决方法
- webpack打包后直接访问页面图片路径错误的解决方法
- 解决vue-cli项目打包出现空白页和路径错误的问题
- 【笔记】vue-cli 打包后路径问题出错的解决方法
- 关于Vue背景图打包之后访问路径错误问题的解决
- webpack打包vue项目后,一些文件图片路径找不到的问题解决办法
- 解决vue-cli webpack打包后加载资源的路径问题
- 基于vue打包后字体和图片资源失效问题的解决方法
- vue-cli中解决css引用图片打包后找不到文件资源的问题
- eWebeditor编辑器上传图片路径错误解决方法[疑难杂症]【转,作者:unvs】
- 解决vue-cli项目webpack打包后iconfont文件路径的问题
- vue打包后图片路径错误无法显示
- 解决vue打包css文件中背景图片的路径问题
- vue :src 文件路径错误问题的解决方法
- vue-cli项目打包出现空白页和路径错误问题