webpack with multiple angular 2 modules
<p>I have an <code>ASP.NET Core</code> site with 2 pages, the page routing is done via <code>MVC</code>, not <code>Angular 2</code>. Each of those pages has its own <code>Angular 2</code> "app". I am having a real hard time trying to get this to work with <code>webpack</code>.</p>

<p>If I bootstrap both of the components into one module, then I get a <code>The selector "xxx" did not match any elements</code> error. However, if I try to create multiple <code>entry</code>s in the <code>webpack.config.js</code> then the <code>polyfills</code> freaks out because it is unable to find the other module.</p>

<p>How do I get this to work? Is the only option available to me here is to be forced to use the <code>Angular 2</code> router and create a SPA?</p>

<p>Here's the relevant portion of my <code>webpack.config.js</code>:</p>

<pre><code>entry: {
    "polyfills": "./App/polyfills.ts",
    "vendor": "./App/vendor.ts",
    "firstapp": "./App/bootfirst.ts",
    "secondapp": "./App/bootsecond.ts"
},
resolve: {
    extensions: ['', '.ts', '.js', '.json', '.css', '.scss', '.html']
},
output: {
    path: process.cwd() + "/wwwroot",
    publicPath: "/js/",
    filename: "js/[name].js"
},
</code></pre>