Skip to content

@ngtools/webpack above 1.8.0 is not working because of removing the decorators #8525

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.

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

Closed
p3x-robot opened this issue Nov 17, 2017 · 26 comments
Closed

Comments

@p3x-robot
Copy link

p3x-robot commented Nov 17, 2017

Versions

Not using ng, just using @ngtools/webpack with webpack.

Repro steps

tsconfig.aot.json

{
  "compilerOptions": {
    "skipLibCheck": true,
    "outDir": "build/aot",
    "target": "es5",
    "module": "commonjs",
    "moduleResolution": "node",
    "sourceMap": false,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "noImplicitAny": true,
    "suppressImplicitAnyIndexErrors": true,
    "lib": [
      "es5",
      "es6",
      "dom",
      "es2015.collection",
      "es2015.promise",
      "es2015.core",
      "es2016",
      "es2017"
    ]
  },
  "includes": [
    "src/angular/**/*",
    "test/angular-webpack/**/*"
  ],
  "exclude": [
    "node_modules",
    "src/angular/boot.ts",
    "test/angular-webpack/angular/boot.ts",
    "build/browser"
  ],
  "angularCompilerOptions": {
    "annotationsAs": "decorators",
    "preserveWhitespaces": false
  }
}

Observed behavior

ERROR in Error: TypeError: Cannot read property 'getTsProgram' of undefined
  at AngularCompilerPlugin._getTsProgram (/home/patrikx3/Projects/patrikx3/corifeus/corifeus-web/node_modules/@ngtools/webpack/src/angular_compiler_plugin.js:186:62)
  at getTypeChecker (/home/patrikx3/Projects/patrikx3/corifeus/corifeus-web/node_modules/@ngtools/webpack/src/angular_compiler_plugin.js:487:43)
  at ast_helpers_1.collectDeepNodes.filter (/home/patrikx3/Projects/patrikx3/corifeus/corifeus-web/node_modules/@ngtools/webpack/src/transformers/remove_decorators.js:14:60)
  at Array.filter (<anonymous>:null:null)
  at standardTransform (/home/patrikx3/Projects/patrikx3/corifeus/corifeus-web/node_modules/@ngtools/webpack/src/transformers/remove_decorators.js:14:14)
  at transformer (/home/patrikx3/Projects/patrikx3/corifeus/corifeus-web/node_modules/@ngtools/webpack/src/transformers/make_transform.js:14:25)
  at /home/patrikx3/Projects/patrikx3/corifeus/corifeus-web/node_modules/typescript/lib/typescript.js:2492:86
  at reduceLeft (/home/patrikx3/Projects/patrikx3/corifeus/corifeus-web/node_modules/typescript/lib/typescript.js:2188:30)
  at /home/patrikx3/Projects/patrikx3/corifeus/corifeus-web/node_modules/typescript/lib/typescript.js:2492:42
  at transformRoot (/home/patrikx3/Projects/patrikx3/corifeus/corifeus-web/node_modules/typescript/lib/typescript.js:63602:82)
  at Object.map (/home/patrikx3/Projects/patrikx3/corifeus/corifeus-web/node_modules/typescript/lib/typescript.js:1696:29)
  at Object.transformNodes (/home/patrikx3/Projects/patrikx3/corifeus/corifeus-web/node_modules/typescript/lib/typescript.js:63590:30)
  at Object.emitFiles (/home/patrikx3/Projects/patrikx3/corifeus/corifeus-web/node_modules/typescript/lib/typescript.js:66273:28)
  at emitWorker (/home/patrikx3/Projects/patrikx3/corifeus/corifeus-web/node_modules/typescript/lib/typescript.js:69725:33)
  at /home/patrikx3/Projects/patrikx3/corifeus/corifeus-web/node_modules/typescript/lib/typescript.js:69687:66
  at runWithCancellationToken (/home/patrikx3/Projects/patrikx3/corifeus/corifeus-web/node_modules/typescript/lib/typescript.js:69779:24)
  at Object.emit (/home/patrikx3/Projects/patrikx3/corifeus/corifeus-web/node_modules/typescript/lib/typescript.js:69687:20)
  at defaultEmitCallback (/home/patrikx3/Projects/patrikx3/corifeus/corifeus-web/node_modules/@angular/compiler-cli/src/transformers/program.js:33:20)
  at AngularCompilerProgram.emit (/home/patrikx3/Projects/patrikx3/corifeus/corifeus-web/node_modules/@angular/compiler-cli/src/transformers/program.js:242:30)
  at AngularCompilerPlugin._emit (/home/patrikx3/Projects/patrikx3/corifeus/corifeus-web/node_modules/@ngtools/webpack/src/angular_compiler_plugin.js:717:49)
  at Promise.resolve.then.then.then (/home/patrikx3/Projects/patrikx3/corifeus/corifeus-web/node_modules/@ngtools/webpack/src/angular_compiler_plugin.js:553:54)
  at <anonymous>:null:null
  at process._tickCallback (internal/process/next_tick.js:188:7)

Desired behavior

With Angular 5.0.1 it was working.

Mention any other details that might be useful (optional)

Is @ngtools/webpack behind with Angular 5.0.2 ?

@p3x-robot p3x-robot changed the title @ngtools/webpack error since Angular 5.0.2 @ngtools/webpack v1.8.2 error since Angular 5.0.2 Nov 17, 2017
@p3x-robot
Copy link
Author

p3x-robot commented Nov 17, 2017

Ok, i confirmed, Angular 5.0.2 is not broken, only @ngtools/webpack is broken in 1.8.2 and 1.8.3. With 1.8.0 it works.

@p3x-robot p3x-robot changed the title @ngtools/webpack v1.8.2 error since Angular 5.0.2 @ngtools/webpack v1.8.2-1.8.3 error since Angular 5.0.2 Nov 22, 2017
@filipesilva
Copy link
Contributor

Heya, I can reproduce this issue with our tests that use the plugin by itself.

Can you setup a minimal repro please? You can read here why this is needed. A good way to make a minimal repro is to create a new app app that uses the plugin with a simplified webpack config and adding the minimum possible code to show the problem. Then you can push this repository to github and link it here.

@filipesilva filipesilva self-assigned this Nov 22, 2017
@filipesilva filipesilva added the needs: repro steps We cannot reproduce the issue with the information given label Nov 22, 2017
@p3x-robot
Copy link
Author

p3x-robot commented Nov 23, 2017

heya!

Heya, I can reproduce this issue with our tests that use the plugin by itself.

you mean

Heya, I cannot reproduce this issue with our tests that use the plugin by itself.
Is that what you are saying?

@filipesilva
Copy link
Contributor

Yes, that is what I meant. Sorry for the confusion 😞

@p3x-robot
Copy link
Author

Well, you can built it like this:

git clone https://github.com/patrikx3/corifeus-builder-angular
cd corifeus-builder-angular
yarn install
yarn link
git clone https://github.com/patrikx3/corifeus-web-material
cd corifeus-web-material
yarn install
grunt

With 1.8.0 it works, with 1.8.5 is not, same error.

The webpack settings are in
https://github.com/patrikx3/corifeus-builder-angular/tree/master/src/config/webpack/angular

Now if you change at corifeus-builder-angular/package.json and change @ngtools/webpack to 1.8.5 you can observe that it is that error.

I guess you still have to go to corifeus-builder-angular directory and:

rm -rf ./node_modules
yarn install

Then go to cd corifeus-web-material

rm -rf ./node_modules
yarn install
yarn link corifeus-builder-angular
grunt

Now you get the same error. Is it in the webpack that changed? Or the tsconfig.json?

Here are the files the are connected to @ngtools/webpack:
https://github.com/patrikx3/corifeus-builder-angular/blob/master/src/config/webpack/angular/prod.js
(it is using AngularCompilerPlugin)

https://github.com/patrikx3/corifeus-web-material/blob/master/tsconfig.aot.json

Is something changed?

@filipesilva filipesilva added needs: investigation Requires some digging to determine if action is needed P3 An issue that is relevant to core functions, but does not impede progress. Important, but not urgent type: bug/fix and removed needs: repro steps We cannot reproduce the issue with the information given labels Dec 7, 2017
@danieleds
Copy link

Still same error on 1.9.0

@p3x-robot
Copy link
Author

I have given the repro steps, now it is Angular 5.1.1 and 1.9 and it is the same error. With a simple test it works, but given I have a complex repo I have no idea what the error is. Right now it doesn't even show what the error is in my repo, it is all about angular-cli and @ngtools/webpack and typescript.

Very fishy. Is there something changed, I need a new decorator or what? I can't find the error.
With 1.8.0 it works as expected.

I guess you could understand more about the @ngtools/webpack internals why it throws these errors.

Running "webpack:cory-build-aot" (webpack) task
Hash: 4152ea35cf6303d1eec7                                                         
Version: webpack 3.10.0
Time: 5108ms
 2 assets
   [0] ./test/angular-webpack/angular/polyfills.ts 0 bytes {1} [built]
   [1] ./test/angular-webpack/angular/bundle.aot.ts 0 bytes {0} [built]

ERROR in : TypeError: Cannot read property 'getTsProgram' of undefined
  at AngularCompilerPlugin._getTsProgram (/home/patrikx3/Projects/patrikx3/corifeus/corifeus-web-material/node_modules/@ngtools/webpack/src/angular_compiler_plugin.js:187:62)
  at getTypeChecker (/home/patrikx3/Projects/patrikx3/corifeus/corifeus-web-material/node_modules/@ngtools/webpack/src/angular_compiler_plugin.js:511:43)
  at ast_helpers_1.collectDeepNodes.filter (/home/patrikx3/Projects/patrikx3/corifeus/corifeus-web-material/node_modules/@ngtools/webpack/src/transformers/remove_decorators.js:14:60)
  at Array.filter (<anonymous>:null:null)
  at standardTransform (/home/patrikx3/Projects/patrikx3/corifeus/corifeus-web-material/node_modules/@ngtools/webpack/src/transformers/remove_decorators.js:14:14)
  at transformer (/home/patrikx3/Projects/patrikx3/corifeus/corifeus-web-material/node_modules/@ngtools/webpack/src/transformers/make_transform.js:14:25)
  at /home/patrikx3/Projects/patrikx3/corifeus/corifeus-web-material/node_modules/typescript/lib/typescript.js:2479:86
  at reduceLeft (/home/patrikx3/Projects/patrikx3/corifeus/corifeus-web-material/node_modules/typescript/lib/typescript.js:2186:30)
  at /home/patrikx3/Projects/patrikx3/corifeus/corifeus-web-material/node_modules/typescript/lib/typescript.js:2479:42
  at transformRoot (/home/patrikx3/Projects/patrikx3/corifeus/corifeus-web-material/node_modules/typescript/lib/typescript.js:63992:82)
  at Object.map (/home/patrikx3/Projects/patrikx3/corifeus/corifeus-web-material/node_modules/typescript/lib/typescript.js:1693:29)
  at Object.transformNodes (/home/patrikx3/Projects/patrikx3/corifeus/corifeus-web-material/node_modules/typescript/lib/typescript.js:63980:30)
  at Object.emitFiles (/home/patrikx3/Projects/patrikx3/corifeus/corifeus-web-material/node_modules/typescript/lib/typescript.js:66715:28)
  at emitWorker (/home/patrikx3/Projects/patrikx3/corifeus/corifeus-web-material/node_modules/typescript/lib/typescript.js:70241:33)
  at /home/patrikx3/Projects/patrikx3/corifeus/corifeus-web-material/node_modules/typescript/lib/typescript.js:70203:66
  at runWithCancellationToken (/home/patrikx3/Projects/patrikx3/corifeus/corifeus-web-material/node_modules/typescript/lib/typescript.js:70295:24)
  at Object.emit (/home/patrikx3/Projects/patrikx3/corifeus/corifeus-web-material/node_modules/typescript/lib/typescript.js:70203:20)
  at defaultEmitCallback (/home/patrikx3/Projects/patrikx3/corifeus/corifeus-web-material/node_modules/@angular/compiler-cli/src/transformers/program.js:33:20)
  at AngularCompilerProgram.emit (/home/patrikx3/Projects/patrikx3/corifeus/corifeus-web-material/node_modules/@angular/compiler-cli/src/transformers/program.js:241:30)
  at AngularCompilerPlugin._emit (/home/patrikx3/Projects/patrikx3/corifeus/corifeus-web-material/node_modules/@ngtools/webpack/src/angular_compiler_plugin.js:741:49)
  at Promise.resolve.then.then.then (/home/patrikx3/Projects/patrikx3/corifeus/corifeus-web-material/node_modules/@ngtools/webpack/src/angular_compiler_plugin.js:577:54)
  at <anonymous>:null:null
  at process._tickCallback (internal/process/next_tick.js:160:7)


Child test/angular-webpack/angular/layout.html:
     1 asset
       [0] ./test/angular-webpack/angular/layout.html 1.4 kB {0} [built]
Child test/angular-webpack/angular/page/raw.html:
     1 asset
       [0] ./test/angular-webpack/angular/page/raw.html 20 bytes {0} [built]
Child src/component/cory-mat-login/cory-mat-login.html:
     1 asset
       [0] ./src/component/cory-mat-login/cory-mat-login.html 1.27 kB {0} [built]
Child html-webpack-plugin for "index.html":
     1 asset
       [0] ./node_modules/html-webpack-plugin/lib/loader.js!./test/angular-webpack/index.html 279 bytes {0} [built]
Warning:  Use --force to continue.

Aborted due to warnings.

If I build it with patrikx3/corifeus-web and change @ngtools/webpack to 1.9.0 it works, but when I move to patrikx3/corifeus-web-material then it is not working. Maybe it is Angular Material ?

@p3x-robot
Copy link
Author

I think it is not in sync with Angular itself. Some small error must be. Given with 1.8.0 it works, but I logged and the getTsProgram is always undefined.

@p3x-robot
Copy link
Author

p3x-robot commented Dec 25, 2017

Isn't it because of this?
image

In the tsconfig.aot.json I heavily use exclude and when I was trying with hacking I saw that sometimes it is not using the exclude and I have to run in JIT and then build with AOT, so I have a bundle.aot.ts and a bundle.ts. I think this is the root cause.

@p3x-robot
Copy link
Author

p3x-robot commented Dec 25, 2017

i have uncommented but still error. I dont know. :( Reverted to 1.8.0.

@p3x-robot
Copy link
Author

With 1.9.3 the error presists:

ERROR in : TypeError: Cannot read property 'getTsProgram' of undefined
  at AngularCompilerPlugin._getTsProgram (/home/patrikx3/Projects/patrikx3/corifeus/corifeus-web/node_modules/@ngtools/webpack/src/angular_compiler_plugin.js:188:62)
  at getTypeChecker (/home/patrikx3/Projects/patrikx3/corifeus/corifeus-web/node_modules/@ngtools/webpack/src/angular_compiler_plugin.js:512:43)
  at ast_helpers_1.collectDeepNodes.filter (/home/patrikx3/Projects/patrikx3/corifeus/corifeus-web/node_modules/@ngtools/webpack/src/transformers/remove_decorators.js:14:60)
  at Array.filter (<anonymous>:null:null)
  at standardTransform (/home/patrikx3/Projects/patrikx3/corifeus/corifeus-web/node_modules/@ngtools/webpack/src/transformers/remove_decorators.js:14:14)
  at transformer (/home/patrikx3/Projects/patrikx3/corifeus/corifeus-web/node_modules/@ngtools/webpack/src/transformers/make_transform.js:14:25)
  at /home/patrikx3/Projects/patrikx3/corifeus/corifeus-web/node_modules/typescript/lib/typescript.js:2479:86
  at reduceLeft (/home/patrikx3/Projects/patrikx3/corifeus/corifeus-web/node_modules/typescript/lib/typescript.js:2186:30)
  at /home/patrikx3/Projects/patrikx3/corifeus/corifeus-web/node_modules/typescript/lib/typescript.js:2479:42
  at transformRoot (/home/patrikx3/Projects/patrikx3/corifeus/corifeus-web/node_modules/typescript/lib/typescript.js:63992:82)
  at Object.map (/home/patrikx3/Projects/patrikx3/corifeus/corifeus-web/node_modules/typescript/lib/typescript.js:1693:29)
  at Object.transformNodes (/home/patrikx3/Projects/patrikx3/corifeus/corifeus-web/node_modules/typescript/lib/typescript.js:63980:30)
  at Object.emitFiles (/home/patrikx3/Projects/patrikx3/corifeus/corifeus-web/node_modules/typescript/lib/typescript.js:66715:28)
  at emitWorker (/home/patrikx3/Projects/patrikx3/corifeus/corifeus-web/node_modules/typescript/lib/typescript.js:70241:33)
  at /home/patrikx3/Projects/patrikx3/corifeus/corifeus-web/node_modules/typescript/lib/typescript.js:70203:66
  at runWithCancellationToken (/home/patrikx3/Projects/patrikx3/corifeus/corifeus-web/node_modules/typescript/lib/typescript.js:70295:24)
  at Object.emit (/home/patrikx3/Projects/patrikx3/corifeus/corifeus-web/node_modules/typescript/lib/typescript.js:70203:20)
  at defaultEmitCallback (/home/patrikx3/Projects/patrikx3/corifeus/corifeus-web/node_modules/@angular/compiler-cli/src/transformers/program.js:33:20)
  at AngularCompilerProgram.emit (/home/patrikx3/Projects/patrikx3/corifeus/corifeus-web/node_modules/@angular/compiler-cli/src/transformers/program.js:241:30)
  at AngularCompilerPlugin._emit (/home/patrikx3/Projects/patrikx3/corifeus/corifeus-web/node_modules/@ngtools/webpack/src/angular_compiler_plugin.js:745:49)
  at Promise.resolve.then.then.then (/home/patrikx3/Projects/patrikx3/corifeus/corifeus-web/node_modules/@ngtools/webpack/src/angular_compiler_plugin.js:578:54)
  at <anonymous>:null:null
  at process._tickCallback (internal/process/next_tick.js:160:7)

@p3x-robot
Copy link
Author

How can I find out the error? Why it is somewhere an error in AngularCompilerPlugin not the code.

@p3x-robot
Copy link
Author

Versions

Using webpack, not using ng.
Angular CLI (latest) and Angular all the latest (5.1.3).

Repro steps

It is written here to repro: #8525

Observed behavior

It is related to this: #8525

Desired behavior

Should not remove decorators or kindly fix it, so it works with my repro steps.
I couldn't at all create a new project of my own with this remove decorators new function in 1.8.1.

Mention any other details that might be useful (optional)

This file is in @ngtools/webpack 1.9.3 :
File: angular_compiler_plugin.ts

If I comment this code:

// Remove unneeded angular decorators.
//this._transformers.push(removeDecorators(isAppPath, getTypeChecker));

It works.
I think the removeDecorators is not working for sure.

Is there an options to keep the decorators? While is it removing something that is doing this?

@p3x-robot p3x-robot changed the title @ngtools/webpack v1.8.2-1.8.3 error since Angular 5.0.2 @ngtools/webpack above 1.8.0 is not working because of removing the decorators Jan 5, 2018
@p3x-robot
Copy link
Author

Ciao!
How are you!
@ngtools/webpack 1.10.0-beta.0 is still the same error.

@p3x-robot
Copy link
Author

Ciao!
How are you!
1.10.0-beta.1 is still the same error.

@p3x-robot
Copy link
Author

Ciao!
How are you!
1.10.0-beta.3 is still the same error including 1.9.7.

@p3x-robot
Copy link
Author

Ciao!
How are you!
1.10.0-rc.0 is still the same error .... Decorators are removed... Thanks....

@getsaf
Copy link

getsaf commented Feb 10, 2018

Seeing the same thing here.
Switching skipCodeGeneration to false brings the decorators back but I lose template type-checking amongst other niceties of template codegen.

@p3x-robot
Copy link
Author

ciao!
how are you?
so what it means loose template type-checking amongst other niceties of template codegen?
bigger bundle?

@p3x-robot
Copy link
Author

@getsaf no change at all, same error

@filipesilva filipesilva added area: @ngtools/webpack and removed needs: investigation Requires some digging to determine if action is needed P3 An issue that is relevant to core functions, but does not impede progress. Important, but not urgent type: bug/fix labels Feb 10, 2018
@getsaf
Copy link

getsaf commented Feb 10, 2018

@p3x-robot I mean template type-safety checks aren't run so any template errors aren't caught during the build.

I do see the decorators and inlined html/scss in the output when I turn the flag off. I'm working in a rather large project with multiple teams so type checking the templates is necessary. I need a fix for this soon.

@p3x-robot
Copy link
Author

@p3x-robot
Copy link
Author

It works, with all latest versions, including Typescript 2.7.x

@p3x-robot
Copy link
Author

#10059

@anbaran
Copy link

anbaran commented Sep 14, 2018

Hi. I saw you have the same issue with AOT compiling and you also use Grunt with grunt-webpack. You might be interested to the issues I created:
#12248

And most importantly here: webpack-contrib/grunt-webpack#168

@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 8, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
Development

No branches or pull requests

5 participants