webpack单独打包css文件, 使css中的url路径错误
一开始打包的dist文件的如下:
想把dist中的css文件,单独打包放到dist文件夹下的css文件夹,于是开始动手:
之前使用的mini-css-extract-plugin把css拆分出来用外链的形式引入:
这是修改前的效果, 图片显示正常:
修改部分:
修改后的目录:
dist目录中多了一个css文件夹, 达到预期, 可是图片显示不正常了:
在新页面中打开背景图, url地址栏显示.......dist/css/img/dog.37d12e64.jpg, 而真正的图片应该在dist/img/dog.37d12e64.jpg, 路径不对, 所以显示不了
解决方法: 在rules中关于.css文件的设置选项中设置publicPath为'../'
设置之后, 狗子回来了:
