pford68 / angular2-momentum

Angular 2 Examples
0 stars 0 forks source link

TypeScript error if you remove Watchify #3

Closed pford68 closed 7 years ago

pford68 commented 7 years ago

Background

Watchify keeps the Browserify task alive. While not an issue in this test project, in a real project, say built with Jenkins, the Browserify task would probably block the Jenkins build from quitting, as a result and would be block further builds.

Thus, I tried to make the use of Watchify depend on whether NODE_ENV was either blank or set to "development." In the process, I found that removing the Watchify plugin from the configured set of plugins prevented TypeScript from being compiled. TypeScript threw the following error:

TypeScript error: node_modules/@angular/common/src/directives/ng_class.d.ts(46,34): Error TS2304: Cannot find name 'Set'.

Bug

In other words, the presence of Watchify allowed tsify (or TypeScript compiling) to work. I cannot build the project (which uses TypeScript, ES6, and Babelify for transpiling) without having Watchify involved.

pford68 commented 7 years ago

Setting target: 'ES6 in tsify options yields this error:

TypeScript error: src/ts/cart/CartComponent.ts(14,5): Error TS1240: Unable to resolve signature of property decorator when called as an expression.
  Supplied parameters do not match any signature of call target.

...when Watchify is removed from the pipeline.

Again, everything works when Watchify is added, which makes me think that possible issues/solutions like @types or Typings are irrelevant/unnecessary. (I tried installing Typings and core-js, etc. earlier to no avail.)

pford68 commented 7 years ago

Setting target: 'es5' results in the original error. We want the TypeScript target to be 'es6', then to let Babelify transpile.

pford68 commented 7 years ago

This turned out to be a total non-problem. As usual, when you Google a problem, and no one else is talking about it, the problem is probably with you. (Some people did discuss the error shown above in comment 2, but the source of the problem was not the same, since my app built when Watchify was active.) Sure enough, this is was the case.

Fixes

Error TS1240: Unable to resolve signature of property decorator when called as an expression. Supplied parameters do not match any signature of call target.

The source of the error was simply a missing parentheses (parameter list) next to @Input, which annotated the items property of the CartComponent class.

Error TS2304: Cannot find name 'Set'.

That said, the earlier error about Error TS2304: Cannot find name 'Set'. still required adding target: 'es6' to the tsify option.

pford68 commented 7 years ago

It would have helped if I had noticed that Error TS1240 referred to line 14, where the @Input() annotation was. I had assumed that @NgModule was the source of the problem, thus did not notice the missing parentheses for @Input.

pford68 commented 7 years ago

After these changes I confirmed that the app built and deployed without Watchify, and that changes were not rebuilt and redeployed automatically in that case. Watchify defaults to being in the Browserify options plugin list, but if NODE_ENV is not 'development` (or blank), Watchify is removed from the plugin list.