Angular-cli: PurifyPlugin require statement for build-optimizer missing in ejected config

Created on 13 Aug 2017  路  13Comments  路  Source: angular/angular-cli

I'm submitting a...


[ ] Regression (a behavior that used to work and stopped working in a new release)
[x] Bug report  
[ ] Feature request
[ ] Documentation issue or request
[ ] Support request => Please do not submit support request here, instead see https://github.com/angular/angular/blob/master/CONTRIBUTING.md#question

Current behavior

ng eject --aot --prod --build-optimizer --no-sourcemaps generates a webpack.config.js that tries to use PurifyPlugin without importing it (ReferenceError: PurifyPlugin is not defined).

ng build --aot --prod --build-optimizer --no-sourcemaps fails with this error:

 92% chunk asset optimization
<--- Last few GCs --->

[455:0x560e167f5620]   707807 ms: Mark-sweep 1413.1 (1518.5) -> 1413.1 (1502.5) MB, 7277.9 / 0.0 ms  (+ 0.0 ms in 0 steps since start of marking, biggest step 0.0 ms, walltime since start of marking 7279 ms) last resort
[455:0x560e167f5620]   715214 ms: Mark-sweep 1413.1 (1502.5) -> 1413.1 (1502.5) MB, 7406.3 / 0.0 ms  last resort


<--- JS stacktrace --->

==== JS stack trace =========================================

Security context: 0x364665b1bbd9 <JS Object>
    2: def_variable [0x364665b02241 <undefined>:3551] [pc=0x4528827ac2b](this=0x1f233b8a5261 <an AST_Function with map 0x127ef311b591>,symbol=0x1f233b8bfc71 <an AST_SymbolFunarg with map 0x150b45cc9009>)
    3: visit [0x364665b02241 <undefined>:3402] [pc=0x45286bed532](this=0x2b8b84e771a1 <a TreeWalker with map 0x3e9d366dda09>,node=0x1f233b8bfc71 <an AST_SymbolFunarg with map 0x150b45cc9009>,de...

FATAL ERROR: CALL_AND_RETRY_LAST Allocation failed - JavaScript heap out of memory
 1: node::Abort() [@angular/cli]
 2: 0x560e14f2b97e [@angular/cli]
 3: v8::Utils::ReportOOMFailure(char const*, bool) [@angular/cli]
 4: v8::internal::V8::FatalProcessOutOfMemory(char const*, bool) [@angular/cli]
 5: v8::internal::Factory::NewFixedArray(int, v8::internal::PretenureFlag) [@angular/cli]
 6: v8::internal::Factory::NewScopeInfo(int) [@angular/cli]
 7: v8::internal::ScopeInfo::Create(v8::internal::Isolate*, v8::internal::Zone*, v8::internal::Scope*, v8::internal::MaybeHandle<v8::internal::ScopeInfo>) [@angular/cli]
 8: v8::internal::DeclarationScope::AllocateVariables(v8::internal::ParseInfo*, v8::internal::AnalyzeMode) [@angular/cli]
 9: v8::internal::DeclarationScope::Analyze(v8::internal::ParseInfo*, v8::internal::AnalyzeMode) [@angular/cli]
10: v8::internal::Compiler::Analyze(v8::internal::ParseInfo*, v8::internal::ThreadedList<v8::internal::ThreadedListZoneEntry<v8::internal::FunctionLiteral*> >*) [@angular/cli]
11: 0x560e148b8aaa [@angular/cli]
12: 0x560e148b9b2f [@angular/cli]
13: 0x560e148be795 [@angular/cli]
14: v8::internal::Compiler::Compile(v8::internal::Handle<v8::internal::JSFunction>, v8::internal::Compiler::ClearExceptionFlag) [@angular/cli]
15: v8::internal::Runtime_CompileLazy(int, v8::internal::Object**, v8::internal::Isolate*) [@angular/cli]
16: 0x452869840bd
../commands/prodbuild.sh: line 10:   455 Aborted                 ng build --aot --prod --build-optimizer --no-sourcemaps

Expected behavior

Both of these commands should work.

Minimal reproduction of the problem with instructions

  • ng new balls ; cd balls ; ng eject --aot --prod --build-optimizer --no-sourcemaps

  • The ng build out of memory error can't be reproduced as easily, so maybe it only happens with sufficiently large projects. I'll get back to you on this one.

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

Functioning as documented.

Environment


Angular version: 4.3.4
Angular CLI version: 1.3.0


For Tooling issues:
- Node version: 8.2.1
- Platform: Debian Sid x86-64 in a Docker image with 4 GB RAM allocated

Others:

2 (required) bufix

Most helpful comment

https://github.com/angular/angular-cli/issues/7110 is related to the TypeError: Cannot read property 'type' of undefined.
If you don't need the operators bindCallback and bindNodeCallback which will both get included if you (or some other module you are using in your application) import all of rxjs using import 'rxjs/Rx' or import { Observable } from 'rxjs/Rx', you can workaround the issue by only importing the operators you actually use.
Or just revert back to typescript 2.3.x until the issue is fixed.

See https://github.com/angular/angular-cli/issues/3904 or https://christianliebel.com/2017/07/import-rxjs-correctly/

All 13 comments

Can you see if your issue is the same as https://github.com/angular/angular-cli/issues/5618 ?

Well, in my case, both of those commands work fine without the --build-optimizer part. Could it still be the same root cause as that issue? Should I try increasing the allocated RAM (currently 4 GB) to see if it mitigates the problem?

@ericmartinezr, I'm not 100% sure why (I suspect it may be due to updating to Node 8.3.0), but the ng build issue has been resolved. However, I'm now getting a build failure with the following error that doesn't look related to my code:

ERROR in ./node_modules/rxjs/observable/BoundCallbackObservable.js
Module build failed: TypeError: Cannot read property 'type' of undefined
    at Object.getEffectiveTypeAnnotationNode (/home/gibson/.build/cyph.com/node_modules/typescript/lib/typescript.js:9341:17)
    at assignContextualParameterTypes (/home/gibson/.build/cyph.com/node_modules/typescript/lib/typescript.js:41652:25)
    at checkFunctionExpressionOrObjectLiteralMethod (/home/gibson/.build/cyph.com/node_modules/typescript/lib/typescript.js:41948:29)
    at checkExpressionWorker (/home/gibson/.build/cyph.com/node_modules/typescript/lib/typescript.js:42959:28)
    at checkExpression (/home/gibson/.build/cyph.com/node_modules/typescript/lib/typescript.js:42898:42)
    at checkExpressionCached (/home/gibson/.build/cyph.com/node_modules/typescript/lib/typescript.js:42779:38)
    at checkReturnStatement (/home/gibson/.build/cyph.com/node_modules/typescript/lib/typescript.js:45418:54)
    at checkSourceElement (/home/gibson/.build/cyph.com/node_modules/typescript/lib/typescript.js:46763:28)
    at Object.forEach (/home/gibson/.build/cyph.com/node_modules/typescript/lib/typescript.js:1506:30)
    at checkBlock (/home/gibson/.build/cyph.com/node_modules/typescript/lib/typescript.js:44563:16)
    at checkSourceElement (/home/gibson/.build/cyph.com/node_modules/typescript/lib/typescript.js:46742:28)
    at checkFunctionExpressionOrObjectLiteralMethodDeferred (/home/gibson/.build/cyph.com/node_modules/typescript/lib/typescript.js:41990:21)
    at checkDeferredNodes (/home/gibson/.build/cyph.com/node_modules/typescript/lib/typescript.js:46828:25)
    at checkSourceFileWorker (/home/gibson/.build/cyph.com/node_modules/typescript/lib/typescript.js:46863:17)
    at checkSourceFile (/home/gibson/.build/cyph.com/node_modules/typescript/lib/typescript.js:46842:13)
    at Object.forEach (/home/gibson/.build/cyph.com/node_modules/typescript/lib/typescript.js:1506:30)
 @ ./node_modules/rxjs/observable/bindCallback.js 2:32-68
 @ ./node_modules/rxjs/add/observable/bindCallback.js
 @ ./node_modules/rxjs/Rx.js
 @ ./src/js/cyph.com/mock-database.service.ts
 @ ./src/$$_gendir/js/cyph.com/app.module.ngfactory.ts
 @ ./src/js/cyph.com/main.ts
 @ multi ./src/js/cyph.com/main.ts
ERROR in ./node_modules/rxjs/observable/BoundNodeCallbackObservable.js
Module build failed: TypeError: Cannot read property 'type' of undefined
    at Object.getEffectiveTypeAnnotationNode (/home/gibson/.build/cyph.com/node_modules/typescript/lib/typescript.js:9341:17)
    at assignContextualParameterTypes (/home/gibson/.build/cyph.com/node_modules/typescript/lib/typescript.js:41652:25)
    at checkFunctionExpressionOrObjectLiteralMethod (/home/gibson/.build/cyph.com/node_modules/typescript/lib/typescript.js:41948:29)
    at checkExpressionWorker (/home/gibson/.build/cyph.com/node_modules/typescript/lib/typescript.js:42959:28)
    at checkExpression (/home/gibson/.build/cyph.com/node_modules/typescript/lib/typescript.js:42898:42)
    at checkExpressionCached (/home/gibson/.build/cyph.com/node_modules/typescript/lib/typescript.js:42779:38)
    at checkReturnStatement (/home/gibson/.build/cyph.com/node_modules/typescript/lib/typescript.js:45418:54)
    at checkSourceElement (/home/gibson/.build/cyph.com/node_modules/typescript/lib/typescript.js:46763:28)
    at Object.forEach (/home/gibson/.build/cyph.com/node_modules/typescript/lib/typescript.js:1506:30)
    at checkBlock (/home/gibson/.build/cyph.com/node_modules/typescript/lib/typescript.js:44563:16)
    at checkSourceElement (/home/gibson/.build/cyph.com/node_modules/typescript/lib/typescript.js:46742:28)
    at checkFunctionExpressionOrObjectLiteralMethodDeferred (/home/gibson/.build/cyph.com/node_modules/typescript/lib/typescript.js:41990:21)
    at checkDeferredNodes (/home/gibson/.build/cyph.com/node_modules/typescript/lib/typescript.js:46828:25)
    at checkSourceFileWorker (/home/gibson/.build/cyph.com/node_modules/typescript/lib/typescript.js:46863:17)
    at checkSourceFile (/home/gibson/.build/cyph.com/node_modules/typescript/lib/typescript.js:46842:13)
    at Object.forEach (/home/gibson/.build/cyph.com/node_modules/typescript/lib/typescript.js:1506:30)
 @ ./node_modules/rxjs/observable/bindNodeCallback.js 2:36-76
 @ ./node_modules/rxjs/add/observable/bindNodeCallback.js
 @ ./node_modules/rxjs/Rx.js
 @ ./src/js/cyph.com/mock-database.service.ts
 @ ./src/$$_gendir/js/cyph.com/app.module.ngfactory.ts
 @ ./src/js/cyph.com/main.ts
 @ multi ./src/js/cyph.com/main.ts

Also, as expected, the ng eject issue still persists.

Getting the same error as above with the build optimizer turned on.

Also getting it

https://github.com/angular/angular-cli/issues/7110 is related to the TypeError: Cannot read property 'type' of undefined.
If you don't need the operators bindCallback and bindNodeCallback which will both get included if you (or some other module you are using in your application) import all of rxjs using import 'rxjs/Rx' or import { Observable } from 'rxjs/Rx', you can workaround the issue by only importing the operators you actually use.
Or just revert back to typescript 2.3.x until the issue is fixed.

See https://github.com/angular/angular-cli/issues/3904 or https://christianliebel.com/2017/07/import-rxjs-correctly/

The first issue was definitely a memory problem and it's being tracked in https://github.com/angular/angular-cli/issues/5618. The second is being tracked in #7110.

Sounds good, thanks @filipesilva. It looks like those are tracking the two ng build problems I reported here; is the ng eject bug being tracked somewhere?

I missed the purify plugin bit actually, that isn't being tracked anywhere else. Reopening to fix that.

temp fix for ejected Webpack build, add the following line to webpack.config.js
const { PurifyPlugin } = require('@angular-devkit/build-optimizer');
or
const PurifyPlugin = require('@angular-devkit/build-optimizer').PurifyPlugin;

Is there any workaround for angular-cli 1.5.0? It uses new PurifyPlugin(),

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

Was this page helpful?
0 / 5 - 0 ratings