webpack打包后css图片路径的问题

问题描述

问 题

我的css路径是这样的

background:url("../images/loginbg.jpg")

webpack中

publicPath:"/dist"

处理图片用的是

{
    test: /\.(png|jpg|gif)$/,
    loader: 'url-loader?limit=10000&name=../images/[name].[ext]'
}

我期望的打包结果是

background:url("/dist/images/loginbg.jpg")

实际结果是

background:url("/dist/../images/loginbg.jpg")

如果将css路径改为

background:url("images/loginbg.jpg")

打包过程会报错

Module build failed: ModuleNotFoundError: Module not found: Error: Can't resolve './images/loginbg.jpg'

何解何解，好痛苦

解决方案

你可以看看这里publicPath，是不是你的CSS路径应该这样写：background:url("/dist/images/loginbg.jpg")

这篇关于webpack打包后css图片路径的问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！