Vue+Webpack打包之后超过url-loader大小限制的图片在css的background-image中使用路径问题
一个vue项目中有一张图片,在css中background-image中使用,大小超过了url-loader大小限制。npm run dev的时候一切正常。npm run build之后图片被直接放在dist/static/img文件夹下,但是打包后的css却在dist/static/css/static/img路径下找该图片,如果我把url-loader大小限制改成超过图片大小也能正常显示,但是图片较大不想这样做,这种情况要如何修改保证打包后路径正确?
修改build/utils.js文件中
if (options.extract) {
return ExtractTextPlugin.extract({
use: loaders,
fallback: 'vue-style-loader',
publicPath: '../../'
})
} else {
return ['vue-style-loader'].concat(loaders)
}
添加:publicPath: '../../' 这一段代码
Vue+Webpack打包之后超过url-loader大小限制的图片在css的background-image中使用路径问题的更多相关文章
- vue webpack打包后 iconfont引入路径不对
vue webpack打包后 iconfont引入路径不对 { test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/, loader: 'url-loader', option ...
- vue webpack打包
webpack构建流程 从启动webpack构建到输出结果经历了一系列过程,它们是: 解析webpack配置参数,合并从shell传入和webpack.config.js文件里配置的参数,生产最后的配 ...
- vue ---webpack 打包上线
先来描述一下期间遇到的问题有哪些: 1.打包后将 dist 文件夹和 index.html 放到 tomcat,在浏览器中访问时,出现空白页,f12 提示 404. 2.打包好的静态资源均是绝对路径 ...
- vue webpack打包后.css文件里面的背景图片路径错误解决方法
资源相对引用路径 问题描述 一般情况下,通过webpack+vuecli默认打包的css.js等资源,路径都是绝对的. 但当部署到带有文件夹的项目中,这种绝对路径就会出现问题,因为把配置的static ...
- vue webpack打包 -webkit-box-orient 失效
一行省略 overflow: hidden; white-space: nowrap; text-overflow: ellipsis; 超出两行省略 overflow: hidden; text-o ...
- vue webpack 打包后css背景图路径问题
最近在写vue-webpack项目时,打包后遇到了css背景图片路径报错的问题 奇怪的是,通过img标签引入的图片路径却没有问题,看来是webpack在打包后,读取css中图片的相对路径出错了. 稍微 ...
- vue+webpack 打包文件 404 页面空白
最近用vue-cli+vue-router+webpack建立项目,其中的遇到的三个问题,整理如下: vue-cli+ webpack 建立的项目,cnpm run build 打包项目之后,需要放在 ...
- 使用vue+webpack打包时,去掉资源前缀
在build文件夹下找到webpack.prod.conf.js文件,搜索 filename: utils.assetsPath('css/[name].[contenthash].css'), 将[ ...
- vue webpack打包背景图片
vue的背景图 和 img标签图大于10KB都不会转成base64处理,可以设置limit(不推荐),所以要设置一个公共路径,解决办法如下
随机推荐
- JVM内存布局及GC知识
一.JVM运行时内存布局 按java 8虚拟机规范的原始表达:(jvm)Run-Time Data Areas, 暂时翻译为"jvm运行时内存布局". 从概念上大致分为6个(逻辑) ...
- Java框架之SpringMVC 05-拦截器-异常映射-Spring工作流程
SpringMVC 拦截器 Spring MVC也可以使用拦截器对请求进行拦截处理,可以自定义拦截器来实现特定的功能,自定义的拦截器可以实现HandlerInterceptor接口中的三个方法,也可以 ...
- Tomcat 9 与JDK 8 的安装与配置
Tomcat 9的安装与配置 解压压缩包,我的解压路径是:D:\Program Files\Java 注意:这里tomcat压缩包不能解压到C盘,否则会因为C盘文件夹访问权限授权问题,没法解决后面出现 ...
- 美食家App开发日记1
前期一直在看第一行代码Android,这本书感觉讲基础讲得特别细致. 百看不如一试. 因为刚刚接触Android,没办法做到想写什么功能就直接一下写好,只能从最开始基础的控件使用开始练习. 所以一直在 ...
- Jenkins配置安装
一.安装 [root@localhost ~]# wget -O /etc/yum.repos.d/jenkins.repo http://pkg.jenkins.io/redhat-stable/j ...
- Mabitis
Mybatis 一.框架概念: Java框架,一个软件半成品,简单来说就是一个别人搭好的舞台,你来做表演,说白了Java框架就是封装好方便程序员操作的类,使项目的开发更简单,维护起来也更容易. 而My ...
- Dynamics email的subject标题出现 CRM:0000xxxx
怎样移除email subject标题中出现的CRM:0000xxxx Settings->Administration->System Settings->Email->Un ...
- 每天玩转3分钟 MyBatis-Plus - 6. select 用法
每天玩转3分钟 MyBatis-Plus - 1. 配置环境 每天玩转3分钟 MyBatis-Plus - 2. 普通查询 每天玩转3分钟 MyBatis-Plus - 3. 高级查询(一) 每天玩转 ...
- XGBoost原理学习总结
XGBoost原理学习总结 前言 XGBoost是一个上限提别高的机器学习算法,和Adaboost.GBDT等都属于Boosting类集成算法.虽然现在深度学习算法大行其道,但很多数据量往往没有太 ...
- java 排序算法分析
一.冒泡排序(时间复杂度O(N^2)) public int[] bubbling(int[] arr){ ) return arr; ; i--){ 1 ; j < i-; j ++){ 2 ...