Angular-cli: build optimizer problem with enum

[alexfung888]

Bug Report or Feature Request (mark with an x)

- [X] bug report -> please search issues before submitting
- [ ] feature request

Versions.

@angular/cli: 1.4.0-rc.2
node: 8.4.0
os: win32 x64
@angular/animations: 4.4.0-RC.0
@angular/cdk: 2.0.0-beta.10
@angular/common: 4.4.0-RC.0
@angular/compiler: 4.4.0-RC.0
@angular/compiler-cli: 4.4.0-RC.0
@angular/core: 4.4.0-RC.0
@angular/flex-layout: 2.0.0-beta.9
@angular/forms: 4.4.0-RC.0
@angular/http: 4.4.0-RC.0
@angular/material: 2.0.0-beta.10
@angular/platform-browser: 4.4.0-RC.0
@angular/platform-browser-dynamic: 4.4.0-RC.0
@angular/platform-server: 4.4.0-RC.0
@angular/router: 4.4.0-RC.0
@angular/cli: 1.4.0-rc.2
typescript: 2.5.2

Repro steps.

Sorry I can't really reproduce the problem. The same code built several times doesn't even result in the same crash.
What is consisent is:
1) it only crashes when build-optimizer is enabled during build
2) it never has problems during ng serve
3) it always crashes at a reference to an enum:

export enum ICommand { show, hide }
command.next(ICommand.show);

error is "cannot read properly show of undefined"
I have seen several different lines from several components. But always when a enum value is referenced, similar to the line above.

The log given by the failure.

normally it is as above, but once I even got:

bootstrap 6c304fd47c63140fc3b0:54 Uncaught TypeError: Cannot read property 'call' of undefined
at __webpack_require__ (bootstrap 6c304fd47c63140fc3b0:54)
at Object.../../../../../src/main.ts (index.ngfactory.ts:2882)
at __webpack_require__ (bootstrap 6c304fd47c63140fc3b0:54)
at Object.0 (index.ngfactory.ts:3190)
at __webpack_require__ (bootstrap 6c304fd47c63140fc3b0:54)
at webpackJsonpCallback (bootstrap 6c304fd47c63140fc3b0:25)
at main.bundle.js:1

and again, it goes away when the optimiser paramter is removed.

Desired functionality.

the ordinal value should be returned

Mention any other details that might be useful.

I hope I can create a small repo that demonstrates the effect, and I wonder if other people has run into it.

I have turned on build-optimizer since it was introduced. My code hasn't changed much. The lines related to the enum definitely haven't changed for a long time. I have the impression that the crashes start to appear with CLI 1.4.0. I am still experimenting with different version.

[alexfung888]

tests indicate that the problem is confined to [email protected] with -build-optimizer.
Does not happen with:
[email protected] with -build-optimizer, or
[email protected] with -build-optimizer, or
[email protected] without -build-optimizer.

[filipesilva]

There is an operation that the build optimizer performs over Enums, that might be causing problems.

[benelliott]

I'm encountering this too. Will try to make a repro!

[benelliott]

I think this should work: https://github.com/benelliott/cli-enum-repro

To reproduce the issue, build without --build-optimizer to see that the enum works, and then build again with --build-optimizer to see the error. Running CLI 1.4, all dependencies untouched from ng new, Windows 10 Enterprise 2016 LTSB, Node 7.10.0.

[ghost]

I was going to create another issue, but seems like this issue describes my problem.

To reproduce the issue:

$ ng new test-proj && cd test-proj
$ npm install --save angular2-toaster

import angular2-toaster module

$ ng serve --build-optimizer --aot

The project compiles successfully, but in the browser I get error

TypeError: Cannot read property 'Default' of undefined
    at new ToasterConfig (toaster-config.js:25)
    at new AppComponent (app.component.ts:16)
    at createClass (core.es5.js:10922)
    at createDirectiveInstance (core.es5.js:10756)
    at createViewNodes (core.es5.js:12197)
    at createRootView (core.es5.js:12092)
    at callWithDebugContext (core.es5.js:13475)
    at Object.debugCreateRootView [as createRootView] (core.es5.js:12792)
    at ComponentFactory_.webpackJsonp.../../../core/@angular/core.es5.js.ComponentFactory_.create (core.es5.js:9864)
    at ComponentFactoryBoundToModule.webpackJsonp.../../../core/@angular/core.es5.js.ComponentFactoryBoundToModule.create (core.es5.js:3333)

toaster-config src: https://github.com/Stabzs/Angular2-Toaster/blob/master/src/toaster-config.ts#L49

the error happens on line

        this.bodyOutputType = configOverrides.bodyOutputType || BodyOutputType.Default;

BodyOutputType is

export enum BodyOutputType {
    Default, TrustedHtml, Component
}

[dereekb]

I just ran into this while upgrading and trying to use the --build-optimizer parameter.

ng build --prod --aot --build-optimizer

The first time I ran it I got a bunch of warnings:

WARNING in ./src/app/app/tallynote/tally/tally/tallyoverview/tallyoverview-cache.ts
15:21-37 "export 'ModelCacheChange' was not found in '../../../../shared/utility/cache'
at HarmonyImportSpecifierDependency._getErrors (/Users/dereekb/Development/TallyNote/Code/tallynote-web-client/node_modules/webpack/lib/dependencies/HarmonyImportSpecifierDependency.js:65:15)
at HarmonyImportSpecifierDependency.getWarnings (/Users/dereekb/Development/TallyNote/Code/tallynote-web-client/node_modules/webpack/lib/dependencies/HarmonyImportSpecifierDependency.js:39:15)
at Compilation.reportDependencyErrorsAndWarnings (/Users/dereekb/Development/TallyNote/Code/tallynote-web-client/node_modules/webpack/lib/Compilation.js:694:24)
at Compilation.finish (/Users/dereekb/Development/TallyNote/Code/tallynote-web-client/node_modules/webpack/lib/Compilation.js:552:9)
at applyPluginsParallel.err (/Users/dereekb/Development/TallyNote/Code/tallynote-web-client/node_modules/webpack/lib/Compiler.js:512:17)
at /Users/dereekb/Development/TallyNote/Code/tallynote-web-client/node_modules/tapable/lib/Tapable.js:289:11
at _addModuleChain (/Users/dereekb/Development/TallyNote/Code/tallynote-web-client/node_modules/webpack/lib/Compilation.js:498:11)
at processModuleDependencies.err (/Users/dereekb/Development/TallyNote/Code/tallynote-web-client/node_modules/webpack/lib/Compilation.js:468:14)
at _combinedTickCallback (internal/process/next_tick.js:67:7)
at process._tickCallback (internal/process/next_tick.js:98:9)

WARNING in ./src/app/app/tallynote/tally/tally/tallyoverview/tallyoverview-cache.ts
23:21-37 "export 'ModelCacheChange' was not found in '../../../../shared/utility/cache'
at HarmonyImportSpecifierDependency._getErrors ...

WARNING in ./src/app/app/shared/appengine/api/model/crud/errors.ts
39:36-62 "export 'ClientApiResponseErrorType' was not found in '../client'
at HarmonyImportSpecifierDependency._getErrors ...

WARNING in ./src/app/app/auth/components/oauth.directive.ts
47:17-33 "export 'OAuthButtonState' was not found in '../../shared/apis/shared/oauth.button.component'
at HarmonyImportSpecifierDependency._getErrors ...

WARNING in ./src/app/app/auth/components/oauth.directive.ts
50:17-33 "export 'OAuthButtonState' was not found in '../../shared/apis/shared/oauth.button.component'
at HarmonyImportSpecifierDependency._getErrors ...

WARNING in ./src/app/app/auth/components/oauth.directive.ts
53:17-33 "export 'OAuthButtonState' was not found in '../../shared/apis/shared/oauth.button.component'
at HarmonyImportSpecifierDependency._getErrors ...

WARNING in ./src/app/app/tallynote/components/tally/shared/tallygoal/views/model-form.component.ts
99:32-45 "export 'TallyGoalType' was not found in '../../../../../tally/tally/tallygoal/tallygoal'
at HarmonyImportSpecifierDependency._getErrors ...

WARNING in ./src/app/app/tallynote/components/tally/shared/tallygoal/utility/text.pipe.ts
9:23-36 "export 'TallyGoalType' was not found in '../../../../../tally/tally/tallygoal/tallygoal'
at HarmonyImportSpecifierDependency._getErrors ...

Since it was similar to errors I had when I mixed classes/instances in the same .ts file, then imported in other .ts files, I moved these enums to their own files.

Warnings went away, and the error that occured in the production changed slightly (exception/error occurs in a different place/file now at runtime) but still refers to enums that seem to be getting removed/made unavailable.

Relevant Package Settings:

    "@angular/cli": "^1.4.1",
    "@angular/compiler-cli": "^4.3.6",
    "@angular/core": "^4.3.6",
    "typescript": "~2.5.0"

[intellix]

Actually I had this as well and forgot to report it :) This temporary workaround works for anyone looking for one:

export enum Numbers {
  one: 'one',
  two: 'two',
};

[jasedwards]

had same issue as @dereekb in that I got those warnings. Moved my enum to a separate file which got rid of the warnings but the enum was still not included in the bundle. the only way to fix it for me was to set build-optimizer to false.

[Taha-Di-Nero]

Hi,
Any fix date is planned or we should downgrade to some working previous version ??
@intellix workaround doesn't worked for me.
Thanks

[iUwej]

Had to downgrade my angular/cli version from 1.4.* to 1.3.2 then all warnings disappeared. I can then build with--aot --build-optimizer

[kondi]

@intellix workaround is working, just be sure you assign string values to enum.

[Taha-Di-Nero]

@kondi u r right the @intellix workaround work.
The problem was with an external library that I don't want to touch.
@filipesilva any release planned to fix this ?? Thanks

[jasedwards]

if I do the workaround from @intellix I get a duplicate identifier error. what am I missing?
export enum MediaType { Phone: 'phone', Tablet: 'tablet' }

[mikejhill]

This seems to have been started by some change between @angular-devkit/[email protected] and @angular-devkit/[email protected] (the latest version). The CLI unlocked the build-optimizer patch version in @angular/[email protected], which @alexfung888's tests show is where the issue started, so it seems like the issue is probably in the build optimizer library.

Here is non-minified output code with and without the build-optimizer:

_ng build --dev_ (the same result is also produced if --aot is added):

/***/ "../../../../../src/node/app/core/log/log-level.enum.ts":
/***/ (function(module, __webpack_exports__, __webpack_require__) {
"use strict";
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return LogLevel; });
var LogLevel;
(function (LogLevel) {
    LogLevel[LogLevel["NONE"] = 0] = "NONE";
    LogLevel[LogLevel["ERROR"] = 1] = "ERROR";
    LogLevel[LogLevel["WARN"] = 2] = "WARN";
    LogLevel[LogLevel["INFO"] = 3] = "INFO";
    LogLevel[LogLevel["DEBUG"] = 4] = "DEBUG";
    LogLevel[LogLevel["ALL"] = 5] = "ALL";
})(LogLevel || (LogLevel = {}));
//# sourceMappingURL=log-level.enum.js.map
/***/ }),

_ng build --dev --aot --built-optimizer_:

/***/ "../../../../../src/node/app/core/log/log-level.enum.ts":
/***/ (function(module, exports) {
var LogLevel = /*@__PURE__*/ (function () {
    var LogLevel = {};
    LogLevel[LogLevel["NONE"] = 0] = "NONE";
    LogLevel[LogLevel["ERROR"] = 1] = "ERROR";
    LogLevel[LogLevel["WARN"] = 2] = "WARN";
    LogLevel[LogLevel["INFO"] = 3] = "INFO";
    LogLevel[LogLevel["DEBUG"] = 4] = "DEBUG";
    LogLevel[LogLevel["ALL"] = 5] = "ALL";
    return LogLevel;
})();
/***/ }),

It's only when I enable the --prod flag that the code gets minified and my LogLevel enum gets wiped. This makes sense since the LogLevel variable created within the outer function when using --build-optimizer is scoped to the outer function yet not returned, so it isn't referenced anywhere and can safely be erased.

Something seems to be missing here. I'm guessing the build optimizer should be setting the module.exports value? Or something similar?

[jponeill]

I've upgraded to "@angular/cli": "1.5.0-beta.0" and this problem still exists in some cases for me. Sorry for the earlier post.

[Taha-Di-Nero]

@intellix workaround is not compatible with the typescript version requested by Angular/cli: < 2.4.0.

[filipesilva]

Sorry about that all. Build optimizer was stripping the export statement out of enums by mistake.

Fixed by https://github.com/angular/devkit/pull/147, verified by https://github.com/angular/devkit/pull/158.

It will be on the next release of the build optimizer and automatically picked up by the CLI.

[alexfung888]

@angular/[email protected] picked up @angular-devkit/[email protected].
It seems resolved on one of my project but continue to crash the other one.

PS I probably made some mistake earlier. Both my projects are running 0.0.21 without enum problems.

[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._}