如果html和css不在同一级目录，如果要用相对路径引用图片，webpack有什么好的解决方案

首页课程实战体系课手记专栏慕课教程

如果html和css不在同一级目录，如果要用相对路径引用图片，webpack有什么好的解决方案

来源：3-7 webpack对icon-font和图片的处理

littlesummer的夏天

2017-06-14

老师我想问下一种情况：假如html中有图片引用，然后css中也有，dist中他们不在同一层级上（html在根目录，css文件在css文件夹中）。但是他们中的url被解析的时候，都是被file-loader解析，即生成的路径是一致的，那会导致css中的url相对路径出错。现在我是通过设置css-loader的url:false来禁止解析css文件中url地址，然后css中直接写生成后的路径，最后在index.js通过require的方式引入图片。但是我感觉这种方式比较繁琐。有什么更好一点的解决方式吗？

写回答

1回答

Rosen

Rosen

2017-06-14

你好，webpack里只要源文件路径引用的是对的，就不用担心打包后的文件了，file-loader加载的时候会自动把源代码中引用图片的路径做替换，保证dist下的文件引用都是对的。

0

0

真实数据对接从0开发前后端分离的企业级上线项目

【毕设项目精品】前端实战，对接真实服务端数据，开发完整项目

4282 学习 · 4121 问题

相似问题

为何首页F楼层里的图片要用<%require= %>引用，而banner里的图片要些相对路径

回答 1

图片打包在css里面的路径不对吧，应该是在resource的上级目录吧

回答 1

为什么一定要用require引入图片啊

回答 3

html-loader如何解析ejs语法

回答 1

老师，3-7中url-loader加载图片后，dist文件中生成了相关代码，resource也出现了，但里面的图片不显示，如图

回答 3

打开慕课网App查看更多内容