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. Sqlalchemy 设置表编码及引擎

    1. 设置引擎编码方式为utf8. engine = create_engine("mysql+pymysql://root:123456@127.0.0.1:3306/sqldb01?ch ...

  2. sersync2 文件的实时同步备份

    |——需求: 监控192.168.9.5[主]  下的 /data/vmeipai 目录  --> 同步到 192.168.12.8 [备] 下的 /data/vmeipai 目录 |——网络拓 ...

  3. Java并发--并发容器之CopyOnWriteArrayList

    原文链接:http://ifeve.com/java-copy-on-write/ Copy-On-Write简称COW,是一种用于程序设计中的优化策略.其基本思路是,从一开始大家都在共享同一个内容, ...

  4. Codeforces 382E Ksenia and Combinatorics 【组合计数】*

    Codeforces 382E Ksenia and Combinatorics Ksenia has her winter exams. Today she is learning combinat ...

  5. VS2013中添加现有窗体项

    假如要从另一项目中拷贝窗体到本项目中,例如FmMain窗体, 需要. 把FmMain.cs 和 FmMain.Designer.cs 和 FmMain .resx 三个文件复制到程序目录下, 在vs里 ...

  6. ballerina 学习十二 变量

    ballerina 有两种方式进行变量的定义,类型加上名称以及初始值.,使用var 关键字 简单例子 代码 import ballerina/io; // 全局public 变量,使用类型定义 pub ...

  7. Gixy Nginx 配置分析工具

    项目简介 Gixy 是一款用来分析 Nginx 配置的工具. Gixy 的主要目标是防止安全配置错误,并自动进行缺陷检测. 目前支持的 Python 版本是 2.7 和 3.5+ . 免责声明:Gix ...

  8. vi配置

    1.配置文件的位置在目录 /etc/ 下面,有个名为vimrc的文件,这是系统中公共的vim配置文件,对所有用户都有效.而在每个用户的主目录下,都可以自己建立私有的配置文件,命名为:“.vimrc”. ...

  9. git clone遇到的[ssh: connect to host github.com port 22]

    起因 在学习递归的时候,对汉诺塔小研究了一番,参考网上写了个demo,后面就想同步到github. 过程 这台电脑是新电脑,所以需要先本地生成ssh key:ssh-keygen -t rsa -C ...

  10. filter异常捕捉

    jsp中抛出一个异常 <% String action = request.getParameter("action"); if ("accountExceptio ...