在做项目过程中，发现引用了图片的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. python中的collections.namedtuple

    简介 collections.namedtuple是一个工厂方法,它可以动态的创建一个继承tuple的子类.跟tuple相比,返回的子类可以使用名称来访问元素. 使用方法 用一个例子来介绍: > ...

  2. python绘图：matplotlib和pandas的应用

    在进行数据分析时,绘图是必不可少的模式探索方式.用Python进行数据分析时,matplotlib和pandas是最常用到的两个库.1.matplotlib库的应用准备工作如下:打开ipython,输 ...

  3. Java入门（5）——类和对象还有构造方法

    类     类和对象的概念: 类是对一群具有相同属性.行为的事物的统称.        类是抽象的.       人以类聚 物以群分 对象:      对象是现实生活中的1个具体存在.      看得 ...

  4. selenium、python、firefox版本配合无敌

     selenium (2.53.6) .python2.7.13. firefox46.0.1 完美

  5. SVN 通过IIS设置反向代理访问

    原因 一个字,穷,没办法,只有一台机器 要当测试服务器还要做源码管理. 解决办法 通过IIS配置反向代理访问SVN,给SVN访问的HTTPS绑定上域名,就可以正常访问了. 1.修改SVN配置 把SVN ...

  6. RSA算法介绍

    详见:http://blog.yemou.net/article/query/info/tytfjhfascvhzxcyt279 2.1.1     算法实现 首先, 找出三个数, p, q, r,其 ...

  7. poj 2455 二分+最大流

    这个因为点少用邻接矩阵做的. 题意:求由1到n的t条不重复路径中最大边权值的最小值. 思路:先对边权进行排序,然后二分边权值,建图求从1到n的最大流,当最大流为t时便求出答案. 代码: #includ ...

  8. 全面解析for循环

    牛刀小试: for(var i = 0 ; i < 100; i++) {console.log(i);} var i = 0;//第一个代码段 i < 100; //第二个代码段 i++ ...

  9. 为什么会需要消息队列(MQ)？

    为什么会需要消息队列(MQ)? #################################################################################### ...

  10. 201521123028 《Java程序设计》第6周学习总结

    1. 本周学习总结 1.1 面向对象学习暂告一段落,请使用思维导图,以封装.继承.多态为核心概念画一张思维导图,对面向对象思想进行一个总结. 2. 书面作业 Q1.clone方法 1.1 Object ...