AOT build fails with fesm modules and if modules import path's `index` omitted

I’m submitting a … (check one with “x”)

[*] bug report => search github for a similar issue or PR before submitting
[*] feature request
[] support request => Please do not submit support request here, instead see https://github.com/angular/angular/blob/master/CONTRIBUTING.md#question

Current behavior

In my library’s modult.ts, we got an AOT compile issue, here is the example code:

// AOT not pass
import { MyDateModule } from './date';   // path without index
import { MyHttpService } from './http';   // path without index
export function MyHttpServiceFactory (_backend: XHRBackend, _option: RequestOptions) {
  return new MyHttpService(_backend, _option);
}
export const MY_HTTP_PROVIDERS = {
  provide: MyHttpService,
  useFactory: MyHttpServiceFactory,
  deps: [
    XHRBackend,
    RequestOptions
  ]
};
@NgModule({
  imports: [
    CommonModule,
    HttpModule,
    MyDateModule
  ],
  exports: [
    MyDateModule
  ]
})
export class MyModule {
  static forRoot(): ModuleWithProviders {
    return {
      ngModule: MyModule,
      providers: [
       MY_HTTP_PROVIDERS
      ]
    };
  }
}

Here is the aot build error message:

Unexpected value 'null' imported by the module 'MyModule in /Users/
naiteluo/Code/maid/dist/packages/demo-app/maid/typings/index.d.ts'

// AOT pass 
import { MyDateModule } from './date/index';
import { MyHttpService } from './http/index';
export function MyHttpServiceFactory (_backend: XHRBackend, _option: RequestOptions) {
  return new MyHttpService(_backend, _option);
}
export const MY_HTTP_PROVIDERS = {
  provide: MyHttpService,
  useFactory: MyHttpServiceFactory,
  deps: [
    XHRBackend,
    RequestOptions
  ]
};
@NgModule({
  imports: [
    CommonModule,
    HttpModule,
    MyDateModule
  ],
  exports: [
    MyDateModule
  ]
})
export class MyModule {
  static forRoot(): ModuleWithProviders {
    return {
      ngModule: MyModule,
      providers: [
       MY_HTTP_PROVIDERS
      ]
    };
  }
}

the index.ts files do exist, and both of the example above can pass the dev build. But without index in the import path, aot build fails.

Expected behavior

Module can be import without index.

Minimal reproduction of the problem with instructions

Using material2’s repo can reproduce the problem:

1. clone material2: https://github.com/angular/material2.git
2. edit ./material2/src/lib/module.ts, remove some of the index in the import path, for example:

import {MdButtonToggleModule} from './button-toggle'; // remove index
import {MdButtonModule} from './button';  // remove index
import {MdCheckboxModule} from './checkbox/index';
import {MdRadioModule} from './radio/index';

1. run gulp aot:build, then build fails with error: Unexpected value 'null' imported by the module 'MaterialRootModule in /Users/ naiteluo/Code/material2/dist/packages/demo-app/material/typings/index.d.ts'

What is the motivation / use case for changing the behavior?

I am trying to build my own library and i choose use material2’s project as the sketch of my own project so i can save my time configuring the project. I can’t post my own code here, but the material library can reproduce the problem.

I meet the aot compile error but the original material2 library pass the aot compile. I have no idea what is going on. Then i try to compare my code with material2 library, i find out the import module with full path like ./autocomplete/index, and in my own library i wrote with short path like ./my-own-module

As usual I wrote import path without index, and the dev build works, but aot fails. It is a bug of angular-compiler that it fails to resolve import path without index?

More and more, it is really hard to understand aot build error. Much more clear error message (likes line number, file name) and additionally guide will be appreciated.

Please tell us about your environment:

mac os, node v6.9.5, npm 3.10.10, yarn v0.21.3

relative package version:

"@angular/animations": "^4.0.0",
    "@angular/common": "^4.0.0",
    "@angular/compiler": "^4.0.0",
    "@angular/core": "^4.0.0",
    "@angular/forms": "^4.0.0",
    "@angular/http": "^4.0.0",
    "@angular/platform-browser": "^4.0.0",
    "core-js": "^2.4.1",
    "rxjs": "^5.0.1",
    "systemjs": "0.19.43",
    "zone.js": "^0.8.4"
"@angular/compiler-cli": "^4.0.0",
    "@angular/platform-browser-dynamic": "^4.0.0",
    "@angular/platform-server": "^4.0.0",
    "@angular/router": "^4.0.0",
"ts-node": "^3.0.0",
    "tslint": "^5.0.0",
    "tslint-no-unused-var": "0.0.6",
    "typescript": "~2.1.1",

• Angular version: 4.0.2

angular compiler version 4.0.2

---

Anybody knows what is going on? Hoping someone to point out. Thank You!!

[cdibbs]

I am having a similar issue trying to build my own library using ngc and rollup. The transpiler appends a ‘/index’ to the import name.

In other words, import { OtherLib } from 'other-lib'; turns into `import { OtherLib } from ‘other-lib/index’. That’s fine until I try to import my library’s generated code which uses OtherLib. Then, it complains that it can’t find ‘other-lib/index’. If I manually remove index from the transpiler output, it works.

Is there a flag or anything that will turn off appending this ‘index’?

[angular-automatic-lock-bot[bot]]

This issue has been automatically locked due to inactivity. Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}