title: Webpack - Copying Files from source to public using CopyWebpackPlugin
body: <p>I have an app in which I'm using Webpack. In this app, I need to copy some static .html files from various directories in my <code>source</code> directory to the same hierarchy in the <code>public</code> directory. In an attempt to do this, I'm using the <a href="https://github.com/kevlened/copy-webpack-plugin" rel="noreferrer">CopyWebpackPlugin</a>. At this time, my webpack.config.js file looks like this:</p>
  
  <p><strong>webpack.config.js</strong></p>
  
  <pre><code>const path = require('path');
  const projectRoot = path.resolve(__dirname, '../');
  
  const CopyWebpackPlugin = require('copy-webpack-plugin');
  
  module.exports = {
    entry: {
      app: './source/index.html.js',
    },
    output: {
      path: path.resolve(__dirname, 'public'),
      filename: '[name].package.js'
    },
    module: {
      rules: [
        {
          test: /\.css$/,
          loaders: ['style-loader','css-loader']        
        },
      ]
    },
    plugins: [
      new CopyWebpackPlugin(
        [ { from: './source/**/*.html', to: './public', force:true } ],
        { copyUnmodified: true }
      )
    ]
  };
  </code></pre>
  
  <p>When I run <code>webpack</code> from the command line, everything works as I want. The HTML files are successfully copied, including their directories, into the <code>public</code> directory. However, when copied, the source directory name is included. For example, if my directory structure is like this:</p>
  
  <pre><code>/source
    /dir-1
      /child-a
        index.html
        page.html
      /child-b
        index.html
        contact.html
    /dir-2
      index.html
  </code></pre>
  
  <p>I'm expecting the result of <code>CopyWebpackPlugin</code> to output to the following:</p>
  
  <p><strong>expected:</strong></p>
  
  <pre><code>/public
    /dir-1
      /child-a
        index.html
        page.html
      /child-b
        index.html
        contact.html
    /dir-2
      index.html
  </code></pre>
  
  <p>However, what I'm actually getting is:</p>
  
  <p><strong>actual:</strong></p>
  
  <pre><code>/public
    /source
      /dir-1
        /child-a
          index.html
          page.html
        /child-b
          index.html
          contact.html
      /dir-2
        index.html
  </code></pre>
  
  <p>Notice how the <code>source</code> directory is included in the copy target. I don't understand why this is being included. More importantly, I need to remove it. How do I remove the <code>source</code> directory from the path in the target?</p>