vue打包静态资源路径不正确的解决办法

vue项目完成打包上线的时候会碰到静态资源找不到的问题,常见的有两个

1、js,css路径不对

解决办法:打开config/index.js,将其中的assetsPublicPath值改为’./’

2、css中引用的图片资源找不到

我的login.vue文件中有一段css,其中引用了一个背景图片,是这样写的

.login{height:100%;background: url("../assets/login_bg.jpg") no-repeat; background-size: cover;color: white;}

“src/assets/”文件夹下有这张图片,打包后路径发生变化这个图片就找不到了,

打开“build/utils.js”,增加一行代码即可

publicPath:'../../'

转载自:https://www.cnblogs.com/diantao/p/7776523.html

vue打包静态资源路径不正确的解决办法的更多相关文章

  1. vue打包静态资源路径不正确的解决办法【转】

    vue项目完成打包上线的时候很多人都会碰到静态资源找不到的问题,常见的有两个 1.js,css路径不对 解决办法:打开config/index.js,将其中的assetsPublicPath值改为’. ...

  2. vue+webpack静态资源路径引用

    处理静态资产 你可能已经注意到,在项目结构中我们有两个静态资产目录:src/assets和static/.他们之间有什么区别? 要回答这个问题,我们首先需要了解Webpack如何处理静态资产.在*.v ...

  3. vue项目之webpack打包静态资源路径不准确

    摘自:https://blog.csdn.net/viewyu12345/article/details/83187815 问题 将打包好的项目部署到服务器,发现报错说图片找不到. 静态资源如js访问 ...

  4. vue打包静态资源后显示空白及static文件路径报错

    1.打包之后打开dist的页面显示空白: 这个是打包项目比较常见的一个错误 改一下config下面的index.js中bulid模块导出的路径.因为打包后的index.html里边的内容都是通过scr ...

  5. Vue Cli 打包之后静态资源路径不对的解决方法

    cli2版本: 将 config/index.js 里的 assetsPublicPath 的值改为 './' . build: { ... assetsPublicPath: './', ... } ...

  6. vue打包后出现一些map文件的解决方法

    Vue打包后出现一些map文件的解决办法: 问题: 可能很多人在做vue项目打包,打包之后js中,会自动生成一些map文件,那我们怎么把它去掉不要呢? 1.运行  cnpm run build  开始 ...

  7. 用node.js express设置路径后 子路径下的页面访问静态资源路径出问题

    在routes/news_mian.js 设置了访问news_main.html 的路径 '/',通知设置一个访问news-page.html的子路径'/newspage'子路径.但是在访问loacl ...

  8. springboot之静态资源路径配置

    静态资源路径是指系统可以直接访问的路径,且路径下的所有文件均可被用户直接读取. 在Springboot中默认的静态资源路径有:classpath:/META-INF/resources/,classp ...

  9. 13.1Springboot 之 静态资源路径配置

    Spring 静态资源路径是指系统可以直接访问的路径,且路径下的所有文件均可被用户直接读取. 在Springboot中默认的静态资源路径有:classpath:/META-INF/resources/ ...

随机推荐

  1. 封装 一下 php sql 的存储语句

    function get_insert_sql($obj){ $str1 =""; $str2 =""; foreach($obj as $key => ...

  2. BZOJ2038 2009国家集训队 小Z的袜子(hose) 【莫队】

    BZOJ2038 2009国家集训队 小Z的袜子(hose) Description 作为一个生活散漫的人,小Z每天早上都要耗费很久从一堆五颜六色的袜子中找出一双来穿.终于有一天,小Z再也无法忍受这恼 ...

  3. 【Codeforces】Round #491 (Div. 2) 总结

    [Codeforces]Round #491 (Div. 2) 总结 这次尴尬了,D题fst,E没有做出来.... 不过还好,rating只掉了30,总体来说比较不稳,下次加油 A:If at fir ...

  4. HDU2896 病毒侵袭 【AC自动机】

    HDU2896 病毒侵袭 Problem Description 当太阳的光辉逐渐被月亮遮蔽,世界失去了光明,大地迎来最黑暗的时刻....在这样的时刻,人们却异常兴奋--我们能在有生之年看到500年一 ...

  5. Core Animation1-简介

    一.Core Animation简介 * Core Animation,中文翻译为核心动画,它是一组非常强大的动画处理API,使用它能做出非常炫丽的动画效果,而且往往是事半功倍.也就是说,使用少量的代 ...

  6. python笔记-9(subprocess模块、面向对象、socket入门)

    一.subprocess 模块 1.了解os.system()与os.popen的区别及不足 1.1 os.system()可以执行系统指令,将结果直接输出到屏幕,同时可以将指令是否执行成功的状态赋值 ...

  7. linux python 图形编程 qt开发环境搭建

    我的系统是 ubuntu14.04 我们使用的是python2.7,建议安装qt4+pyqt4+eric4 eric是pyqt的界面设计器的代码生成软件. 1.安装sip 这个是python和qt之间 ...

  8. UML基本架构建模--类的术语和概念

     Terms and Concepts 术语和概念   A classis a description of a set of objects that share the same attrib ...

  9. cocos2dx 云彩特效

    cocos2dx 云彩特效,就是一张云彩Png 图片从屏幕左边移动到右边,再从左边移动到右边 yuncai = static_cast<ImageView*>(Helper::seekWi ...

  10. ecmall页面空白解决方案(转)

    页面空白解决方案: ------------------------------------------------------------------------------------------ ...