文件加载器图像完整路径

Question

如何使用文件加载器保存完整的图像路径？

我的装载机配置文件

test: /\.(png|jpe?g|gif|ico)$/, 
     use: [ 'file-loader?name=[name].[ext]&outputPath=images/'  ]

img路径src/images/1.jpg and src/images/section/2.jpg

在生产中我得到 dist/images/1.jpg 和 dist/images/2.jpg

我试过改成use: [ 'file-loader?name=[path][name].[ext] ]

但是开始生产 dist/src/images/1.jpg 和 dist/src/images/section/2.jpg

如何更改加载程序设置以开始生产 dist/images/1.jpg 和 dist/images/section/2.jpg？

"file-loader": "^0.11.2"
"webpack": "^3.5.5"

谢谢

Answer 1

[path] placeholder is the path relative to the context. By default that is the root of your project, more specifically the directory where you run webpack from, unless you've configured the context option.

file-loader 本身也接受 context option，它允许您仅针对给定规则更改该行为。在您的情况下，您可以将其设置为 src.

{
  test: /\.(png|jpe?g|gif|ico)$/,
  use: [
    {
      loader: 'file-loader',
      options: {
        name: '[path][name].[ext]',
        context: 'src'
      }
    }
  ]
}

文件加载器图像完整路径

file-loader image full path

javascript

webpack

webpack-file-loader