Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

v1.5.1 AOT Build - Uncaught ReferenceError: InjectionToken is not defined #8518

Closed
distributedlock opened this issue Nov 16, 2017 · 9 comments · Fixed by #8519
Closed

v1.5.1 AOT Build - Uncaught ReferenceError: InjectionToken is not defined #8518

distributedlock opened this issue Nov 16, 2017 · 9 comments · Fixed by #8519

Comments

@distributedlock
Copy link

distributedlock commented Nov 16, 2017 •
edited
Loading

Versions

Angular CLI: 1.5.1
Node: 8.6.0
OS: win32 x64
Angular: 5.0.1
... animations, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, platform-server, router
... service-worker

@angular/cli: 1.5.1
@angular-devkit/build-optimizer: 0.0.33
@angular-devkit/core: 0.0.20
@angular-devkit/schematics: 0.0.36
@ngtools/json-schema: 1.1.0
@ngtools/webpack: 1.8.1
@schematics/angular: 0.1.5
typescript: 2.4.2
webpack: 3.8.1

Repro steps

  • ng serve --aot

Observed behavior

Uncaught ReferenceError: InjectionToken is not defined
    at eval (logger.service.ts:20)
    at Object.../../../../../src/app/shared/services/logger/logger.service.ts (main.bundle.js:206)
    at __webpack_require__ (inline.bundle.js:713)
    at fn (inline.bundle.js:118)
    at eval (logger.module.ts:2)
    at Object.../../../../../src/app/shared/services/logger/logger.module.ts (main.bundle.js:198)
    at __webpack_require__ (inline.bundle.js:713)
    at fn (inline.bundle.js:118)
    at eval (index.ts:1)
    at Object.../../../../../src/app/shared/services/index.ts (main.bundle.js:190)

Desired behavior

The app builds fine in AOT mode with no error, but when I run it in the browser, it results in the error provided above during bootstrap process. I tried to reproduce this error on CLI 1.5.0 and it works fine. It complains about InjectionToken being not defined.

Mention any other details that might be useful (optional)

Only happening on v1.5.1, works on v1.5.0. No other dependency was changed. All I did was upgrade @angular/cli from 1.5.0 to 1.5.1.
@bomberblue07
Copy link

bomberblue07 commented Nov 16, 2017 •
edited
Loading

I have a similar issue. My app worked fine with 5.0.1 and CLI 1.5.0. Once I upgraded to 1.5.1, the app fails to load properly and the first error I get is from one of my components: ReferenceError: EventEmitter is not defined ReferenceError: EventEmitter is not defined

The offending line of code is a declaration of a property of my component before the constructor:

@Output() notify: EventEmitter<string> = new EventEmitter<string>();

Moving this initialization to the constructor didn't help. My app works fine with a JIT build, but breaks once AOT is involved.

@ghost
Copy link

ghost commented Nov 16, 2017 •
edited by ghost
Loading

Same here. I'm getting Uncaught ReferenceError: Optional is not defined with AOT build after upgrading to 1.5.1.

Code that causes the error:

// some code....
import { Inject, Injectable, Optional, Renderer, SkipSelf, InjectionToken } from '@angular/core';
// some code....
export const CLIPBOARD_SERVICE_PROVIDER = {
    provide: ClipboardService,
    deps: [DOCUMENT, WINDOW, [
        new Optional(), // -<<< error
        new SkipSelf(),
        ClipboardService
    ]],
    useFactory: CLIPBOARD_SERVICE_PROVIDER_FACTORY
};
// some code....

@briguyd
Copy link

briguyd commented Nov 16, 2017

I'm having the same issue as @bomberblue07. Even just private emitter = new EventEmitter(); breaks when using AOT.

@drewgreenwell
Copy link

drewgreenwell commented Nov 16, 2017 •
edited
Loading

Confirmed that @angular/cli 1.5.1 seems to be the issue

Works with --prod on 1.5.0

onMaximize = new EventEmitter<void>();

Fails with --prod on 1.5.1

ReferenceError: EventEmitter is not defined

@sgomanf
Copy link

sgomanf commented Nov 16, 2017

Confirmed same issus at @angular/cli 1.5.1 when launching the app:

ng build --prod

main.d559f48d0942eebadd8a.bundle.js:1 ERROR ReferenceError: EventEmitter is not defined
at new e (main.d559f48d0942eebadd8a.bundle.js:1)
at jt (main.d559f48d0942eebadd8a.bundle.js:1)
at Vt (main.d559f48d0942eebadd8a.bundle.js:1)
at fn (main.d559f48d0942eebadd8a.bundle.js:1)
at En (main.d559f48d0942eebadd8a.bundle.js:1)
at _n (main.d559f48d0942eebadd8a.bundle.js:1)
at fn (main.d559f48d0942eebadd8a.bundle.js:1)
at un (main.d559f48d0942eebadd8a.bundle.js:1)
at Object.createRootView (main.d559f48d0942eebadd8a.bundle.js:1)
at t.create (main.d559f48d0942eebadd8a.bundle.js:1)
(anonymous) @ main.d559f48d0942eebadd8a.bundle.js:1
main.d559f48d0942eebadd8a.bundle.js:1 ERROR Error: Uncaught (in promise): ReferenceError: EventEmitter is not defined
ReferenceError: EventEmitter is not defined
at new e (main.d559f48d0942eebadd8a.bundle.js:1)
at jt (main.d559f48d0942eebadd8a.bundle.js:1)
at Vt (main.d559f48d0942eebadd8a.bundle.js:1)
at fn (main.d559f48d0942eebadd8a.bundle.js:1)
at En (main.d559f48d0942eebadd8a.bundle.js:1)
at _n (main.d559f48d0942eebadd8a.bundle.js:1)
at fn (main.d559f48d0942eebadd8a.bundle.js:1)
at un (main.d559f48d0942eebadd8a.bundle.js:1)
at Object.createRootView (main.d559f48d0942eebadd8a.bundle.js:1)
at t.create (main.d559f48d0942eebadd8a.bundle.js:1)
at new e (main.d559f48d0942eebadd8a.bundle.js:1)
at jt (main.d559f48d0942eebadd8a.bundle.js:1)
at Vt (main.d559f48d0942eebadd8a.bundle.js:1)
at fn (main.d559f48d0942eebadd8a.bundle.js:1)
at En (main.d559f48d0942eebadd8a.bundle.js:1)
at _n (main.d559f48d0942eebadd8a.bundle.js:1)
at fn (main.d559f48d0942eebadd8a.bundle.js:1)
at un (main.d559f48d0942eebadd8a.bundle.js:1)
at Object.createRootView (main.d559f48d0942eebadd8a.bundle.js:1)
at t.create (main.d559f48d0942eebadd8a.bundle.js:1)
at i (polyfills.a1ece476dc448026a76f.bundle.js:1)
at polyfills.a1ece476dc448026a76f.bundle.js:1
at t.invokeTask (polyfills.a1ece476dc448026a76f.bundle.js:1)
at Object.onInvokeTask (main.d559f48d0942eebadd8a.bundle.js:1)
at t.invokeTask (polyfills.a1ece476dc448026a76f.bundle.js:1)
at r.runTask (polyfills.a1ece476dc448026a76f.bundle.js:1)
at o (polyfills.a1ece476dc448026a76f.bundle.js:1)
at
(anonymous) @ main.d559f48d0942eebadd8a.bundle.js:1

@hansl
Copy link
Contributor

hansl commented Nov 16, 2017

We're investigating. If we haven't found a root cause in 15-30 minutes after this message we'll revert the PR and do an emergency release.

@hansl
Copy link
Contributor

hansl commented Nov 16, 2017

I reverted the latest dist-tag to 1.5.0. You can probably just reinstall your project and be good. We're going to be investigating.

drewgreenwell added a commit to drewgreenwell/electron-angular that referenced this issue Nov 16, 2017
@drewgreenwell
reverted angular/cli to 1.5.0 angular/angular-cli#8518
2f4e659 
updated old handlebars reference by dependency due to security vulnerability
hansl added a commit to hansl/angular-cli that referenced this issue Nov 17, 2017
@hansl
fix(@ngtools/webpack): fix elide removing whole imports on single match
2c351a0 
If an import imports multiple symbols, the previous condition meant that the whole
import statement was removed, instead of only the symbol.

Fixes angular#8518.
@hansl hansl mentioned this issue Nov 17, 2017
Merged
hansl added a commit that referenced this issue Nov 17, 2017
@hansl
fix(@ngtools/webpack): fix elide removing whole imports on single match
f6d9ba8 
If an import imports multiple symbols, the previous condition meant that the whole
import statement was removed, instead of only the symbol.

Fixes #8518.
@distributedlock
Copy link
Author

@hansl Thanks for the quick response and fix. Much appreciated 👍

Brocco pushed a commit that referenced this issue Nov 17, 2017
@hansl @Brocco
fix(@ngtools/webpack): fix elide removing whole imports on single match
6aa3c68 
If an import imports multiple symbols, the previous condition meant that the whole
import statement was removed, instead of only the symbol.

Fixes #8518.
Brocco pushed a commit that referenced this issue Nov 17, 2017
@hansl @Brocco
fix(@ngtools/webpack): fix elide removing whole imports on single match
62f3454 
If an import imports multiple symbols, the previous condition meant that the whole
import statement was removed, instead of only the symbol.

Fixes #8518.
dond2clouds pushed a commit to d2clouds/speedray-cli that referenced this issue Apr 23, 2018
@hansl @dond2clouds
fix(@ngtools/webpack): fix elide removing whole imports on single match
4655a21 
If an import imports multiple symbols, the previous condition meant that the whole
import statement was removed, instead of only the symbol.

Fixes angular#8518.
@angular-automatic-lock-bot
Copy link

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.

@angular-automatic-lock-bot angular-automatic-lock-bot bot locked and limited conversation to collaborators Sep 7, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

fix(@ngtools/webpack): fix elide removing whole imports on single match hansl/angular-cli
6 participants
@briguyd @hansl @drewgreenwell @distributedlock @sgomanf @bomberblue07