title: webpack 4 - split chunks plugin for multiple entries
body: <p>Using <a href="https://webpack.js.org/plugins/split-chunks-plugin/" rel="noreferrer">split chunks plugin</a> with the following config :</p>
  
  <pre><code>{
      entry: {
          entry1: [entry1.js],
          entry2: [entry2.js],
          entry3: [entry3.js],
          ...
      }
      optimization: {
          splitChunks: {
              chunks: "all"
          }
      } 
  }
  </code></pre>
  
  <p>The code would get perfectly split into:</p>
  
  <pre><code>vendors-entry1-entry2-entry3.js // common for all
  vendors-entry1-entry3.js // vendors only required by both entry1, entry3
  entry1-entry2.js // common code of entry1 and entry2
  entry1.js // unique entry's code
  entry2.js
  entry3.js
  </code></pre>
  
  <p>Question is, <strong>how do i now use the specific vendors per entry in my html (or ejs in my specific case)</strong>?</p>
  
  <p>Using <a href="https://webpack.js.org/plugins/html-webpack-plugin/" rel="noreferrer">HtmlWebpackPlugin</a> as recommended would simply create an index.html which loads all of the above, although the use case is clearly:</p>
  
  <p>When rendering <strong>entry1</strong> page - load:</p>
  
  <pre><code>vendors-entry1-entry2-entry3.js
  vendors-entry1-entry3.js
  entry1-entry2.js
  entry1.js
  </code></pre>
  
  <p>When rendering <strong>entry2</strong> page - load:</p>
  
  <pre><code>vendors-entry1-entry2-entry3.js
  entry1-entry2.js
  entry2.js
  </code></pre>
  
  <p>etc..</p>