Preserve subdirectories for images in webpack output #50

Author: jedrzejchalubek

build/app.config.js

@@ -36,7 +36,7 @@ module.exports = merge({
   outputs: {
     css: { filename: 'css/[name].css' },
     font: { filename: 'fonts/[name].[ext]' },
-    image: { filename: 'images/[name].[ext]' },
+    image: { filename: 'images/[path][name].[ext]' },
     javascript: { filename: 'js/[name].js' }
   },
 

build/rules/images.js

@@ -9,6 +9,7 @@ module.exports = {
   include: config.paths.images,
   loader: 'file-loader',
   options: {
+    context: config.paths.images,
     publicPath: config.paths.relative,
     name: config.outputs.image.filename,
     emitFile: false

build/webpack.config.js

@@ -95,6 +95,7 @@ module.exports = {
     new ExtractTextPlugin(config.outputs.css),
     new CleanPlugin(config.paths.public, { root: config.paths.root }),
     new CopyPlugin([{
+      context: config.paths.images,
       from: {
         glob: `${config.paths.images}/**/*`,
         flatten: true,