在做项目过程中，发现引用了图片的less文件被extract-text-webpack-plugin打包过之后，里面的图片引用路径指向到了extract-text-webpack-plugin打包目录下了，出现了找不到图片问题。

new ExtractTextWebpackPlugin({ filename: 'css/[name].css' });
 
这种情况可能的解决方案之一: 在webpack的配置文件的output中配置publicPath即可。

extract-text-webpack-plugin打包css后出现图片引用路径不对问题的更多相关文章

  1. webpack快速入门——CSS分离与图片路径处理

    1.在终端安装extract-text-webpack-plugin 2.引入插件 const extractTextPlugin = require("extract-text-webpa ...

  2. webpack快速入门——CSS中的图片处理

    1.首先在网上随便找一张图片,在src下新建images文件夹,将图片放在文件夹内 2.在index.html中写入代码:<div id="pic"></div& ...

  3. Webpack打包css后z-index被重新计算的解决方法

    发现问题 最近在使用 Webpack 打包 css 文件时,发现了一个问题,发现打包后的 z-index 值跟源文件 z-index 不一致. 如下图,左侧是源文件,右侧是打包后的文件: 即使加上 ! ...

  4. 【原】使用webpack打包的后，公共请求路径的配置问题

    在我们公司,和后台接接口时,公共的请求路径我们是单独抽出来的,放在一个独立的public.js中,在public.js中存入那个公共变量 公共变量是这样 在其他地方使用ajax时,我们就这样使用 这种 ...

  5. webpack踩坑之路 (2)——图片的路径与打包

    刚开始用webpack的同学很容易掉进图片打包这个坑里,比如打包出来的图片地址不对或者有的图片并不能打包进我们的目标文件夹里(bundle).下面我们就来分析下在webpack项目中图片的应用场景. ...

  6. ThinkPHP的调用css,js和图片的路径

    按网上的说法,在根目录下建了一个Public目录,把css,js和图片放到Public目录下,然后用__PUBLIC__/...或__ROOT__/Public/...调用.但是发现无论如何改路径都无 ...

  7. webpack分离打包css和less

    github仓库:https://github.com/llcMite/webpack.git 为什么要分离打包?       答:刚开始学webpack的时候就很郁闷,明明没几个文件,打包出来体积特 ...

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

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

  9. webpack打包 css文件里面图片路径 替换位置

    { test: /\.css$/, use: ExtractTextPlugin.extract({ use: ['css-loader?minimize', 'autoprefixer-loader ...

随机推荐

  1. 深入理解JVM（七）——性能监控工具

    前言 工欲善其事必先利其器,性能优化和故障排查在我们大都数人眼里是件比较棘手的事情,一是需要具备一定的原理知识作为基础,二是需要掌握排查问题和解决问题的流程.方法.本文就将介绍利用性能监控工具,帮助开 ...

  2. SoapUI 之 JDBC请求

    之前有试过Jmeter的JDBC请求,挺方便的,今天下午闲来没事,看见soapUI里面也有一个JDBC请求,便也来试试. 首先添加一个JDBC请求,然后直接把Jmeter的一些链接参数复制过去,一直报 ...

  3. Java IO 学习总结 学习手册总结

    Java IO 是一套Java用来读写数据(输入和输出)的API.大部分程序都要处理一些输入,并由输入产生一些输出.Java为此提供了java.io包. 代码 github地址:https://git ...

  4. 使用jquery.form.js提交表单上传文件

    方法: 1.formSerilize()  用于序列化表单中的数据,并将其自动整理成适合AJAX异步请求的URL地址格式. 2.clearForm()   清除表单中所有输入值的内容. 3.restF ...

  5. 6.分析request_irq和free_irq函数如何注册注销中断

    上一节讲了如何实现运行中断,这些都是系统给做好的,当我们想自己写个中断处理程序,去执行自己的代码,就需要写irq_desc->action->handler,然后通过request_irq ...

  6. ln命令详解

    ln命令 (全称:link) ln命令用来为文件创建一个连接,类似于Windows的快捷方式,连接类型分为硬连接和软连接(符号连接)两种,默认的连接类型是硬连接.如果要创建符号连接必须使用" ...

  7. poj 2063完全背包

    题意:给出总资金和投资年份 ,n个股票 给出股票价格和其一年的利润.问如何选择能获得最大利润. 思路:股票可以重复选择,完全背包问题,完全背包也是从01背包衍生而行的,其主要区别在于中间那层循环的次序 ...

  8. 深度神经网络在量化交易里的应用 之二 -- 用深度网络(LSTM)预测5日收盘价格

        距离上一篇文章,正好两个星期. 这边文章9月15日 16:30 开始写. 可能几个小时后就写完了.用一句粗俗的话说, "当你怀孕的时候,别人都知道你怀孕了, 但不知道你被日了多少回 ...

  9. NHibernate教程(12)--延迟加载

    本节内容 引入 延迟加载 实例分析 1.一对多关系实例 2.多对多关系实例 结语 引入 通过前面文章的分析,我们知道了如何使用NHibernate,比如CRUD操作.事务.一对多.多对多映射等问题,这 ...

  10. 【Java线程】Java内存模型总结

    学习资料:http://www.infoq.com/cn/articles/Java-memory-model-1 Java的并发采用的是共享内存模型(而非消息传递模型),线程之间共享程序的公共状态, ...