--build-optimizer giving 'browser' doesn't contain a valid alias configuration error

[gmfun]

Bug Report or Feature Request (mark with an x)

- [x ] bug report -> please search issues before submitting

Versions.

@angular/cli: 1.3.0-rc.0
node: 6.10.3
os: darwin x64
@angular/animations: 4.1.2
@angular/common: 4.1.2
@angular/compiler: 4.1.2
@angular/core: 4.1.2
@angular/forms: 4.1.2
@angular/http: 4.1.2
@angular/platform-browser: 4.1.2
@angular/platform-browser-dynamic: 4.1.2
@angular/router: 4.1.2
@angular/cli: 1.3.0-rc.0
@angular/compiler-cli: 4.1.2

Repro steps.

Not able to reproduce. Gives error on
ng build --prod --build-optimizer

The log given by the failure.

Field 'browser' doesn't contain a valid alias configuration
/Users/gauravmukherjee/website/dashboard/v3/client/node_modules/tslib.js doesn't exist
as directory

Desired functionality.

ng build --prod --build-optimizer should work

Mention any other details that might be useful.

[filipesilva]

Does this happen without --build-optimizer?

[mattma]

@filipesilva

Without --build-optimizer, ng build --aot --prod and ng build --prod --build-optimizer, run into the same issue. I have to revert back to v1.2.3

By looking at the error message below, I think it is related to how I import the module. I use the latest angular-cli v1.3.0-rc.0 templates, and angular 5.0.0-beta.0.

Here is an example of how I include the template/style

@Component({
  moduleId: module.id,
  selector: 'app-feature-name',
  templateUrl: './feature-name.component.html',
  styleUrls: ['./feature-name.component.sass'],
})

ERROR in ./src/main.ts
Module not found: Error: Can't resolve './$$_gendir/app/app.module.ngfactory' in '/PATH/TO/dashboard/src'
resolve './$$_gendir/app/app.module.ngfactory' in '/PATH/TO/dashboard/src'
using description file: /PATH/TO/dashboard/package.json (relative path: ./src)
Field 'browser' doesn't contain a valid alias configuration
after using description file: /PATH/TO/dashboard/package.json (relative path: ./src)
using description file: /PATH/TO/dashboard/package.json (relative path: ./src/$$_gendir/app/app.module.ngfactory)
no extension
Field 'browser' doesn't contain a valid alias configuration
/PATH/TO/dashboard/src/$$_gendir/app/app.module.ngfactory doesn't exist
  .ts
Field 'browser' doesn't contain a valid alias configuration
/PATH/TO/dashboard/src/$$_gendir/app/app.module.ngfactory.ts doesn't exist
  .js
Field 'browser' doesn't contain a valid alias configuration
/PATH/TO/dashboard/src/$$_gendir/app/app.module.ngfactory.js doesn't exist
as directory
/PATH/TO/dashboard/src/$$_gendir/app/app.module.ngfactory doesn't exist
  [/PATH/TO/dashboard/src/$$_gendir/app/app.module.ngfactory]
[/PATH/TO/dashboard/src/$$_gendir/app/app.module.ngfactory.ts]
[/PATH/TO/dashboard/src/$$_gendir/app/app.module.ngfactory.js]
[/PATH/TO/dashboard/src/$$_gendir/app/app.module.ngfactory]
@ ./src/main.ts 3:0-74
@ multi ./src/main.ts
ERROR in ./src/$$_gendir lazy
Module not found: Error: Can't resolve '/PATH/TO/dashboard/src/$$_gendir/app/capabilities/feature-name.module.ngfactory.ts' in '/PATH/TO/dashboard/src/$$_gendir'
resolve '/PATH/TO/dashboard/src/$$_gendir/app/capabilities/feature-name.module.ngfactory.ts' in '/PATH/TO/dashboard/src/$$_gendir'
using description file: /PATH/TO/dashboard/package.json (relative path: ./src/$$_gendir)
Field 'browser' doesn't contain a valid alias configuration
after using description file: /PATH/TO/dashboard/package.json (relative path: ./src/$$_gendir)
using description file: /PATH/TO/dashboard/package.json (relative path: ./src/$$_gendir/app/capabilities/feature-name.module.ngfactory.ts)
no extension
Field 'browser' doesn't contain a valid alias configuration
/PATH/TO/dashboard/src/$$_gendir/app/capabilities/feature-name.module.ngfactory.ts doesn't exist
  .ts
Field 'browser' doesn't contain a valid alias configuration
/PATH/TO/dashboard/src/$$_gendir/app/capabilities/feature-name.module.ngfactory.ts.ts doesn't exist
  .js
Field 'browser' doesn't contain a valid alias configuration
/PATH/TO/dashboard/src/$$_gendir/app/capabilities/feature-name.module.ngfactory.ts.js doesn't exist
as directory
/PATH/TO/dashboard/src/$$_gendir/app/capabilities/feature-name.module.ngfactory.ts doesn't exist
  [/PATH/TO/dashboard/src/$$_gendir/app/capabilities/feature-name.module.ngfactory.ts]
[/PATH/TO/dashboard/src/$$_gendir/app/capabilities/feature-name.module.ngfactory.ts.ts]
[/PATH/TO/dashboard/src/$$_gendir/app/capabilities/feature-name.module.ngfactory.ts.js]
[/PATH/TO/dashboard/src/$$_gendir/app/capabilities/feature-name.module.ngfactory.ts]

[scttcper]

I was getting this too its related to #7113

[mattma]

@scttcper I tried with the fix. both with/without bo failed the same way (error identical above) tried both version of the enhanced-resolve v3.3.0 pinned, and latest v3.4.1, run into the same issue

[scttcper]

@mattma that fix doesn't always work. They published v1.3.0-rc.1 with the pinned verison

[mattma]

@scttcper I have updated to v1.3.0-rc.1, it did not work with the same error. Now i am on v1.2.4, build works but no --build-optimizer

[JSMike]

fyi, for some reason I had to make sure enhanced-resolve was set as a dependency and not a dev-dependency for the issue to get resolved.

[mattma]

@JSMike Tried with your solution with rc.1, that does not work. it did not work even with ng build --prod.

@filipesilva the issue was labeled with need info. What kind of info does it miss?

[elvisbegovic]

same error here after passing to 1.3rc1

cc @filipesilva

thanks in advance if any news

[filipesilva]

If this happens with and without --build-optimizer then it is a dupe of #7113, and the solution is in #7113 (comment).

Be aware that yarn seem to be bugged and not resolving the dependencies properly in some versions: #7136 (comment).

[mattma]

@filipesilva It does fix the issue with rc.3. Build pipeline is fine now.

The only issue is the app does not work by missing HTTP modules. I am using the newest HttpClientModule. is it being supported with experimental --build-optimizer ?

[filipesilva]

I'm not aware of it being unsupported... Can you open a new issue with a reproduction for me to investigate?

[eddieedease]

I get this error only when i use --build-optimer.
Normal builds (and aot) works fine without it. Don't use yarn but npm. Any ideas?

[filipesilva]

@eddieedease can you open a new issue with a reproduction please?

[eddieedease]

Got it fixed by bumping typescript to 2.5.1

[filipesilva]

Your issue was most like #7110 then.

[playground]

@filipesilva is this related to #7341?
I was getting

Field 'browser' doesn't contain a valid alias configuration
/PATH/TO/dashboard/src/$$_gendir/app/app.module.ngfactory doesn't exist
  .ts

after upgrading to typescript v2.5.2, that error went away but getting "cannot find module" for AoT.
I'm on cli v1.4.0

[joshikeerti]

I upgraded to angular cli 1.4.4, but I am still seeing this error
Field 'browser' doesn't contain a valid alias configuration

I tried installing "enhanced-resolve": "3.3.0", but that did not seem to help either.
ng serve throws the error and everything under /assets/ is not being resolved.

[raysuelzer]

A similar issue occurs for me on Travis using Node 7 and NPM 5. Downgrading to NPM 4 resolves the issue. Also Node 6 and NPM 5 work.

[FrancescoBorzi]

I'm also experiencing this issue using ng build --prod. Cli version 1.5.2

[husainsr]

I am also experience same issue that "ngfactory not found" and "Field 'browser' doesn't contain a valid alias configuration"

[stefdelec]

SAme here. Any update ?

[angular-automatic-lock-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.}