title: Error: Cannot find module 'app/MyComponent/MyComponent.module' Error: Cannot find module
body: <p>this very similar to the one mentioned <a href="https://stackoverflow.com/questions/41396839/exception-uncaught-in-promise-error-cannot-find-module-app-home-home-modul">here</a> but every solution provided by in comments or answer did not solve my issue. Wanted to see if there is anything else i should look at. I tried different paths like</p>
  
  <ul>
  <li>./app/mycomponent/mycomponent.module#MyComponentModule,</li>
  <li>.mycomponent//mycomponent.module#MyComponentModule</li>
  </ul>
  
  <p>but nothing works. The biggest difference between mine and the original issue is, we recently added webpack and that's when the application broke. When we did not use any bundling service(webpack) and everything was individual files, it all worked just fine. 
  Also my home.module which is the home page doesn't have this issue. Every other pages or modules throw the exact same issue. There is literally not much difference between the home and other modules in terms of implementation. </p>
  
  <p>my <strong>routing module</strong> has this </p>
  
  <pre><code>{
      path: 'mycomponent',
      loadChildren: 'app/mycomponent/mycomponent.module#MyComponentModule'
  }
  </code></pre>
  
  <p>Full exception below </p>
  
  <blockquote>
    <p>bootstrap:51 ERROR Error: Uncaught (in promise): Error: Cannot find
    module 'app/mycomponent/mycomponent.module' Error: Cannot find module
    'app/mycomponent/mycomponent.module'
        at browser.es5.js:91
        at ZoneDelegate.invoke (zone.js:392)
        at Object.onInvoke (animations.es5.js:7)
        at ZoneDelegate.invoke (zone.js:391)
        at Zone.run (zone.js:142)
        at zone.js:873
        at ZoneDelegate.invokeTask (zone.js:425)
        at Object.onInvokeTask (animations.es5.js:7)
        at ZoneDelegate.invokeTask (zone.js:424)
        at Zone.runTask (zone.js:192)
        at browser.es5.js:91
        at ZoneDelegate.invoke (zone.js:392)
        at Object.onInvoke (animations.es5.js:7)
        at ZoneDelegate.invoke (zone.js:391)
        at Zone.run (zone.js:142)
        at zone.js:873
        at ZoneDelegate.invokeTask (zone.js:425)
        at Object.onInvokeTask (animations.es5.js:7)
        at ZoneDelegate.invokeTask (zone.js:424)
        at Zone.runTask (zone.js:192)
        at resolvePromise (zone.js:824)
        at resolvePromise (zone.js:795)
        at zone.js:873
        at ZoneDelegate.invokeTask (zone.js:425)
        at Object.onInvokeTask (animations.es5.js:7)
        at ZoneDelegate.invokeTask (zone.js:424)
        at Zone.runTask (zone.js:192)
        at drainMicroTaskQueue (zone.js:602)</p>
  </blockquote>
  
  <p><strong>below is my webpack config</strong></p>
  
  <pre><code>const path = require('path');
  
  module.exports = {   entry: './src/main.ts',  
  devtool: 'source-map',  
  module: {
      rules: [
        {
          test: /\.tsx?$/,
          loaders: ['ts-loader'],
          exclude: [/\.(spec|e2e)\.ts$/]
        },
        {
          test: /\.(html|css)$/, 
          loader: 'raw-loader',
          exclude: /\.async\.(html|css)$/
        }
      ]   },   
   resolve: {
      extensions: [ '.tsx', '.ts', '.js' ]   },   
   output: {
      filename: 'bundle.js',
      path: path.resolve(__dirname, 'dist')    } };
  </code></pre>
  
  <ul>
  <li>angular : 4.3.6 </li>
  <li>typescript:  2.9.2</li>
  </ul>