title: Angular 2 load components only from root/app folder
body: <p>I have created an angular2 project with angular-cli(version 1.0.0-beta.8, angular version is 2.0.0-rc.3)
  Running <code>ng new</code> or <code>ng init</code> creates this directory structure:</p>
  
  <pre><code>  create .editorconfig
    create README.md
    create src\app\app.component.css
    create src\app\app.component.html
    create src\app\app.component.spec.ts
    create src\app\app.component.ts
    create src\app\environment.ts
    create src\app\index.ts
    create src\app\shared\index.ts
    create src\favicon.ico
    create src\index.html
    create src\main.ts
    create src\system-config.ts
    create src\tsconfig.json
    create src\typings.d.ts
    create angular-cli-build.js
    create angular-cli.json
    create config\environment.dev.ts
    create config\environment.js
    create config\environment.prod.ts
    create config\karma-test-shim.js
    create config\karma.conf.js
    create config\protractor.conf.js
    create e2e\app.e2e-spec.ts
    create e2e\app.po.ts
    create e2e\tsconfig.json
    create e2e\typings.d.ts
    create .gitignore
    create package.json
    create public\.npmignore
    create tslint.json
    create typings.json
  </code></pre>
  
  <p>When I generate a component (ng g component my-component) it adds a folder my-component in the src\app folder with the component files(ts, css, html, etc...)</p>
  
  <p>When I import my-component component in the app(the main one) component and put it in the html:</p>
  
  <pre><code>import { Component } from '@angular/core';
  import { MyComponentComponent } from './my-component';
  
  @Component({
    moduleId: module.id,
    selector: 'app-root',
    templateUrl: 'app.component.html',
    styleUrls: ['app.component.css'],
    directives: [MyComponentComponent]
  })
  export class AppComponent {
    title = 'app works!';
  }
  </code></pre>
  
  <p>app.component.html:</p>
  
  <pre><code>&lt;h1&gt;
    {{title}}
  &lt;/h1&gt;
  &lt;app-my-component&gt;&lt;/app-my-component&gt;
  </code></pre>
  
  <p>everything works.</p>
  
  <p>If I create a folder (named "project" in that case) and move my-component folder there (<code>src\app\project\my-component</code>) and import the component from there:</p>
  
  <pre><code>import { Component } from '@angular/core';
  import { MyComponentComponent } from './project/my-component'; //chnaged "./my-component" to "./project/my-component"
  
  @Component({
    moduleId: module.id,
    selector: 'app-root',
    templateUrl: 'app.component.html',
    styleUrls: ['app.component.css'],
    directives: [MyComponentComponent]
  })
  export class AppComponent {
    title = 'app works!';
  }
  </code></pre>
  
  <p>The application is compiled, but in the browser I get:</p>
  
  <pre><code>zone.js:101 GET http://localhost:4200/app/project/my-component.js 404 (Not Found)
  </code></pre>
  
  <p>Is it a bug or I'm missing something?</p>
  
  <p>Edit:</p>
  
  <p>All the components are correctly compiled irrespective of the folder.</p>
  
  <p>The strange thing is that the application wants to load <code>my-component.js</code> while the generated file is <code>my-component.component.js</code> (this works the same with other names. "component" in the name is not an issue)</p>
  
  <p>When the component folder is in the app folder the application correctly loads <code>my-component.component.js</code></p>
  
  <p>Looks like a bug to me.</p>