webpack 文件加载器相对路径

Ami*_*aie 6 webpack webpack-file-loader

我有一个 webpack 配置文件和一个像这样的图像的示例测试:

   module: {
       rules : [
           test : /\.(jp?g|png|gif)$/,
           'file-loader?name=[name].[ext]&outputPath=images/'
       ]
   }
Run Code Online (Sandbox Code Playgroud)

我有一个像这样的简单文件结构:

/ src
    / img (1.jpg,2.jpg....)
    / css (a.css,b.css....)
    a bunch of html files
Run Code Online (Sandbox Code Playgroud)

现在,当我在 css 文件中引用图像时,我会写一些类似 url('../img/1.jpg) 的内容,因为我需要上一级并进入 img 文件夹,当我在 html 中包含图像时,我需要使用这样的东西: <img data-id="1" src="<%= require('./img/1.jpg') %>" />.


当我运行 webpack 时一切正常,但在最终的 css 文件中没有正确配置路径!我得到这样的东西:

  background: url(src/img/5.jpg); 
Run Code Online (Sandbox Code Playgroud)

但应该是

 background: url(../src/img/5.jpg);
Run Code Online (Sandbox Code Playgroud)

因为生成的 css 文件将在一个 css 文件夹中

换句话说,最终的 css 文件进入一个子文件夹,所以里面的图像引用都应该得到一个 '../' 但他们没有

我希望我足够清楚

这是我的文件结构