vue cli做项目的时候难免会碰到,css引用背景图或者css,js之间的相互引用!!!这时候打包后可能会出现一个错误!!如下图:

  写法:  

    

  错误:

    

  会无端多出一个“/css/static/” 这样就会使路径错误;

  解决办法:

     办法一:

        把不需要编译的东西,直接放在static文件下,css引用的时候直接写相对路径;

        具体原因看:https://segmentfault.com/q/1010000009842688(大致是static文件夹下的东西不会经过编译)

     办法二:进行wepack配置:

        第一步:

        

        第二步:

        

        第三步:

        

然后  npm run build 运行打包就OK了

  具体原因:自己研究,拜拜!!周五快乐!!!!!!

vue cli 打包项目造成css背景图路径错误的更多相关文章

  1. vue项目打包后css背景图路径不对的问题

    问题描述: 自己在自学vue做项目的过程中,遇到一个有关背景图片路径的问题,就是css代码中背景图片是根据相对路径来写的,如下图: 当使用npm run dev命令本地访问的时候,背景图片是正常显示的 ...

  2. vue 打包的项目当背景图路径错误

    当背景图路径错误时: 在build/utils.js中添加或更改这句话:publicPath: '../../',

  3. vue webpack 打包后css背景图路径问题

    最近在写vue-webpack项目时,打包后遇到了css背景图片路径报错的问题 奇怪的是,通过img标签引入的图片路径却没有问题,看来是webpack在打包后,读取css中图片的相对路径出错了. 稍微 ...

  4. Vue-cli 构建项目 的`.vue`组件中, scss中添加背景图路径问题

    [解决方法]: 更改build/utils.js文件中的 ExtractTextPlugin 的 options配置. if (options.extract) { return ExtractTex ...

  5. vue.js 打包时出现空白页和路径错误

    vue-cli输入命令:npm  run  build 即可打包vue.js的项目 打包出来后项目中就会多了一个文件夹dist,下图为我们打包过后的项目 我们直接运行打包后的文件夹中的index.ht ...

  6. vue-cli构建的vue项目打包后css引入的背景图路径不对的问题

    使用vue-cli构建vue项目后,再打包遇到一个css引入的背景图片路径的问题,就是css代码中背景图片是根据相对路径来写的,如下图: 当使用npm run dev命令本地访问的时候,背景图片是正常 ...

  7. Vue项目开发之打包后背景图片路径错误的坑

    在开发vue项目的过程中,使用浏览器进行预览的时候所有图片的路径是没有任何问题的,但是在打包后传到服务器上,在微信端查看背景图片时,background的图片竟然不显示,img标签里的图片却是正常展示 ...

  8. 解决Vue打包后背景图片路径错误问题

    1.原因解析 当用vue-cli自动构建项目后,有两种运行方法,分别是: npm run dev : 提供一个开发的环境,自动热更新,资源使用绝对路径,所以可以正常看到背景图片. npm run bu ...

  9. css背景图与html插入img的区别

    一直以来都认为css背景图与直接插入img图片的效果是差不多的,直到最近拜读了一位大神的作品,发现大部分图片都是通过背景图形式显示的,于是通过搜索各相关资料,在此总结了下二者的区别: 1. css中的 ...

随机推荐

  1. 比beanutil更加灵活的dto转换工具dozer

    准确的说,是因为pojo无法一招走天下或者说内外部隔离的原因,所以有些时候,不得不在两个bean之间做copy或者转换映射.对于直接性的属性拷贝beanutil以及能够满足大部分要求,但是如果遇到字段 ...

  2. HELLO JAVA!

    从今天开始,我将不定期地更新自己在大学学习到的JAVA知识,欢迎大家一同前来观摩学习,如有纰漏还请多多赐教2018-09-1715:39:14

  3. keepalived的原理以及配置使用详解

    一.vrrp协议简介 VRRP(Virtual Router Redundancy Protocol)协议是用于实现路由器冗余的协议. VRRP协议将两台或多台路由器设备虚拟成一个设备,对外提供虚拟路 ...

  4. 基础_cifar10_序贯

    今天的基础研究主要是在cifar10数据集上解决一下几个问题: 1.从头开始,从最简单的序贯开始,尝试model的构造: 2.要将模型打印出来.最好是能够打印出图片,否则也要summary; 3.尝试 ...

  5. topcoder srm 698 div1 -3

    1.定义重复串$S=T+T$,即$S$可以表示成一个串的叠加.给定一个串$s$,可以通过删除字符.修改字符.增加字符来使得其变为重复串.问最少的次数. 思路:首先将$s$分成个串$s_{0},s_{1 ...

  6. extjs的使用笔记

    2006年jack slocum斯洛克姆 基于yui写的扩展前端框架(就是由一些前端可视化组件如表单,树, 表格,等组成的frameset或者叫做 ui engine),叫yui-ext, 后来成熟后 ...

  7. Windows FindFirstFile利用

    目前大多数程序都会对上传的文件名加入时间戳等字符再进行MD5,然后下载文件的时候通过保存在数据库里的文件ID读取文件路径,一样也实现了文件下载,这样我们就无法直接得到我们上传的webshell文件路径 ...

  8. [转]otunnel:一个和lcx差不多的端口转发的工具

    这是一个采用Golang编写的和lcx差不多的端口转发的工具,用来突破内网环境 项目地址 ooclab/otunnel 下载地址(内涵各大平台) http://dl.ooclab.com/otunne ...

  9. Python中的open和codecs.open

    最近老被编码困扰,多次折腾之后,感觉python的编解码做得挺好的,只要了解下边的流程,一般都能解决 input文件(gbk, utf-8...) ----decode-----> unicod ...

  10. P3338 [ZJOI2014]力

    思路 颓柿子的题目 要求求这样的一个式子 \[ F_j=\sum_{i<j}\frac{q_iq_j}{(i-j)^2}-\sum_{i>j}\frac{q_iq_j}{(i-j)^2} ...