title: TypeScript cannot find module error
body: <p><a href="https://i.stack.imgur.com/tpYQy.png" rel="noreferrer"><img src="https://i.stack.imgur.com/tpYQy.png" alt="enter image description here"></a>I am trying to use the template as a directive. For that, i am trying to import it to (app.module.ts). But I am getting an error " TS2307: cannot find module". Can anyone please help me to solve this error. I also uploaded some image. </p>
  
  <p><a href="https://i.stack.imgur.com/xgLO1.png" rel="noreferrer"><img src="https://i.stack.imgur.com/xgLO1.png" alt="enter image description here"></a></p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>//app.module.ts
  
  import { NgModule } from '@angular/core';
  import { BrowserModule } from '@angular/platform-browser';
  
  import { AppComponent }  from './app.component';
  
  import { ProductListComponent } from './products/product-list.component';
  
  
  @NgModule({
    imports: [ BrowserModule ],
    declarations: [ AppComponent, ProductListComponent ],
    bootstrap: [ AppComponent ]
  })
  export class AppModule { }
  
  .....................................................
  
  //product-list.component.ts
  
  import {Component} from '@angular/core';
  @Component({
      selector: 'pm-products',
      templateUrl: 'app/products/product-list.component.html'
  })
  
  export class ProductListComponent { }
  
  .................................................
  
  //app.component.ts
  
  import {Component} from '@angular/core';
  
  @Component({
      selector: 'pm-app',
      // not quotes for template
      template: ` 
      &lt;div&gt;&lt;h1&gt; {{pageTitle}} &lt;/h1&gt;
              &lt;pm-products&gt;&lt;/pm-products&gt;
      &lt;/div&gt;`
  })
  
  export class AppComponent {
      pageTitle: string = 'ACME Product Management';
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;!--
  product-list.component.html
  --&gt;
  
  &lt;div class="panel panel-primary"&gt;
      &lt;div class="panel-heading"&gt;
          Product List
      &lt;/div&gt;
      &lt;div class="panel-body"&gt;
          &lt;div class="row"&gt;
              &lt;div class="col-md-2"&gt;Filter By:&lt;/div&gt;
              &lt;div class="col-md-4"&gt;
                  &lt;input type="text" /&gt;
              &lt;/div&gt;
          &lt;/div&gt;
          &lt;div class="row"&gt;
              &lt;div class="col-md-6"&gt;
                  &lt;h3&gt;Filtered By: &lt;/h3&gt;
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  
      &lt;div class='table-responsive'&gt;
          &lt;table class="table"&gt;
              &lt;thead&gt;
                  &lt;tr&gt;
                      &lt;th&gt;
                          &lt;button class="btn btn-primary"&gt;Show Image&lt;/button&gt;
                      &lt;/th&gt;
                      &lt;th&gt;Products&lt;/th&gt;
                      &lt;th&gt;Code&lt;/th&gt;
                      &lt;th&gt;Available&lt;/th&gt;
                      &lt;th&gt;Price&lt;/th&gt;
                      &lt;th&gt;5 Star Rating&lt;/th&gt;
                  &lt;/tr&gt;
              &lt;/thead&gt;
              &lt;tbody&gt;
  
              &lt;/tbody&gt;
          &lt;/table&gt;
      &lt;/div&gt;
  &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>