Can webpack keep child module's path while exp

Question

Suppose I have a project,which structure is like this

projectFolder
--index.html
--img
--js
--childMod
    --modA
        --index.html
        --img
        --js

In normal config for webpack multiple pages.all images include images in child module will be place into the same folder,like this

buildFolder
--index.html
--modA.html
--allImgs
--bundle.js
--modA.bundle.js

I want webpack keep the project structure,like this

buildFolder
--index.html
--imgs
--bundle.js
--childMod
    --childModImgs
    --modA.html
    --modA.bundle.js

My target is,webpack can recognize the resource's path,if it is inside childMod,then they will be output and placed in childMod's folder,not all together in one folder. How to make it?

Answer 1

From this Github comment, yes you can do it for the file loader:

file?name=[path][name].[ext]&context=/the/root/path

This copies the file /the/root/path/dir/file.png to /output-directory/dir/file.png.

In a Webpack config it might look like:

  { test: \.png$/, loader: "file?name=[path][name].[ext]&context=/the/root/path" },

For assets like CSS and Javascript that are passed through other loaders that bundle and minify the data, no, there's no way to do this. It wouldn't make sense because the Javascript files can come from various folders across the project.