解决vuejs项目里css引用背景图片不能显示的问题
解决:build->utils.js里,修改:增加
publicPath:'../../', if (options.extract) { return ExtractTextPlugin.extract({ use: loaders, publicPath:'../../', fallback: 'vue-style-loader' }) } else { return ['vue-style-loader'].concat(loaders) }
以上这篇解决vuejs项目里css引用背景图片不能显示的问题就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持我们。
相关推荐
-
详解vantUI框架在vue项目中的应用踩坑
1.订单提交地址等组件的应用. 使用的组件有如下: import {Card,button,Toast,AddressList,Popup,AddressEdit,Area} from 'vant' 主要是配货地址编辑这块: <van-address-edit :area-list="areaList" :address-info="addressInfo" show-postal show-delete show-set-default show-searc
-
vue项目设置scrollTop不起作用(总结)
今天在开发中,遇到这样一个情景.一个页面中有三个模块,每个模块对应一个标题,每个模块内容都很长,所以需要点击当前模块对应的标题滚动到模块所在位置. 我想的方案是获取到每个模块距离文档顶部的距离,然后将值赋给对应要滚动的元素. 步骤如下: 首先给每个模块一个id,例如: <div class="module module1" id="anchor-0"> <div class="module module1" id="a
-
详解从react转职到vue开发的项目准备
前言 首先,为什么我需要做这个项目准备工作呢?因为常年习惯React开发的我,最近突然接手了一个Vue项目,而之前基本没有过Vue的实践,这么突兀让还在沉溺于React开发的我进行Vue开发,甚是不习惯,那自然我需要想办法让Vue开发尽量与React相似,这样大概让自己在开发过程中更得心应手吧. 组件开发 特性对比 众所周知,Vue和React都有那么一个特性,那就是可以让我们进行组件化开发,这样可以让代码得到更好的重用以及解耦,在架构定位中这个应该叫纵向分层吧.但是,两个框架开发组件的写法都有
-
解决在vue项目中,发版之后,背景图片报错,路径不对的问题
解决方法: 在utils.js里边的 加上publicPath:'../../', 在引入图片或者背景图的时候,使用方法: 以上这篇解决在vue项目中,发版之后,背景图片报错,路径不对的问题就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持我们. 您可能感兴趣的文章: 关于Vue背景图打包之后访问路径错误问题的解决 vue-cli中打包图片路径错误的解决方法 关于vue.js发布后路径引用的问题解决 vue cli使用绝对路径引用图片问题的解决 详解vue-cil和webp
-
vue项目每30秒刷新1次接口的实现方法
在vue.js项目中,经常需要对数据实时更新--每隔xx秒需要刷新一次接口--即需要用到定时器相关原理 我们先看一看2种常用定时器: setInterval(function(){}, milliseconds)--会不停的调用函数 setTimeout(function(){}, milliseconds)--只执行函数一次 乍看之下,setInterval会符合我们的业务需求,然而也需要注意一些坑,单纯的使用setInterval会导致页面卡死!其原因与JS引擎线程有关(有兴趣的童鞋可自行研
-
vue项目中使用vue-i18n报错的解决方法
前言 Vue-i18n大家应该都不陌生,Vue-i18n安装的安装方法如下: npm install vue-i18n --save 然而最近在vue项目中使用vue-i18n的时候,居然报错了,通过查找相关的资料终于找到了解决的方法,下面话不多说了,来一起看看详细的介绍吧 发现问题 iview-admin框架克隆到本地,添加路由的时候,稍不注意就会遇到以下情况: Value of key 'xxx' is not string! Cannot translate the value of ke
-
使用vue-cli脚手架工具搭建vue-webpack项目
最近更新了webpack配置详解,可移步vue-cli webpack详解 对于Vue.js来说,如果你想要快速开始,那么只需要在你的html中引入一个<script>标签,加上CDN的地址即可.但是,这并不算是一个完整的vue实际应用.在实际应用中,我们必须要一系列的工具,包括:模块化,转译,预处理,热加载,静态检测和自动化测试等.对于一个需要长期维护和大型的项目而言,这些工具是必不可少的,但是尝试配置初始化这些很痛苦.这就是我们发布vue官方提供的脚手架工具的原因,一个简单的构建工具,通过
-
vue项目打包之后背景样式丢失的解决方案
原始 build/untils.js 原因:至于为什么背景图有的打包后存在,有的丢失,那是因为vue会把图片转成base64,但是图片大小超过阈值就不转了,直接引,而背景图片里用的是相对路径最后会直接替换成static,但是明显路径会有问题,所以得配置下. 修改 需要在上面红框中添加下面语句: // 背景图片丢失:写改css中的路径(添加) publicPath: '../../' 然后重新npm run dev即可 总结 以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作
-
Vue项目中设置背景图片方法
在Vue项目开发中我们经常要向页面中添加背景图片,可是当我们在样式中添加了背景图片后,编译打包后,配置到服务器上时,由于路径解析的问题,图片并不能够正确的显示出来,如下CSS样式: background:url("../../assets/head.jpg"); 这个时候我们就要考虑使用其他的方式了,node中提供了一种比较有效的方式来解决这个问题: 1.在data中定义如下: export default { name: 'productdetailspage', data() {
-
vue-cli2.0转3.0之项目搭建的详细步骤
Vue CLI介绍 Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统,提供: 通过 @vue/cli 搭建交互式的项目脚手架. 通过 @vue/cli + @vue/cli-service-global 快速开始零配置原型开发. 一个运行时依赖 (@vue/cli-service),该依赖: 可升级: 基于 webpack 构建,并带有合理的默认配置: 可以通过项目内的配置文件进行配置: 可以通过插件进行扩展. 一个丰富的官方插件集合,集成了前端生态中最好的工具. Vue CLI
随机推荐
- ANT 压缩(去掉空格/注释)JS文件可提高js运行速度
- Vue表单验证插件的制作过程
- Linux下修改jar、zip等文件内的文件详解
- Visual Stduio 2010开发环境搭建教程
- SELinux导致PHP连接MySQL异常Can't connect to MySQL server的解决方法
- 详解Lua中的if语句的使用方法
- c++ 指针与引用的区别介绍及使用说明
- Oracle 数据库操作技巧集
- jquery 实现复选框的全选操作实例代码
- json属性名为什么要双引号(个人猜测)
- 采用CSS和JS,刚好我最近有个站点要用到下拉菜单!
- 最近较流行的效果 Android自定义View实现倾斜列表/图片
- php微信公众号js-sdk开发应用
- C#装箱和拆箱操作实例分析
- 420megs为您提供提供420M免费主页空间服务
- Spring Boot整合logback一个简单的日志集成架构
- 浅谈pyqt5在QMainWindow中布局的问题
- pyqt5 lineEdit设置密码隐藏,删除lineEdit已输入的内容等属性方法
- 详解Vue中组件传值的多重实现方式
- Spring Security常用过滤器实例解析