Search code examples
angularmeteorangular-meteor

Need some help migrating from meteor 1.6.0.1 to 1.6.1 and from angular2-compilers to angular-compilers


I'm trying to update an Angular/Meteor app from Meteor 1.6.0.1 to 1.6.1. First of all I'm doing this after this fix: https://github.com/Urigo/angular-meteor/pull/1889

The first problem I encountered is that the old way of importing html files as templates for Angular components:

import template from './home.component.html';

@Component({
  selector: 'home',
  template
})
export class HomeStartComponent { }

is not working anymore. When I start the application with meteor a "Cannot find module './XXXX.component.html'." message is printed for every Angular component.

The second problem is that I use LESS as CSS pre-compiler and here it says that you need "meteor remove less" in order to use Angular compilers.

I would like to be sure that if I change the old way of importing html templates and use the typical Angular way (templateUrl) for all my components and I switch from LESS to SASS the app will be working.

Despite of the compilation errors when I start the app in the browser the following error is shown in the dev console:

Uncaught ReferenceError: __decorate is not defined
at app.js?hash=16f67970c82d7408c169d90e08545f5c0ba33acc:7411
at current-shop.service.js (app.js?hash=16f67970c82d7408c169d90e08545f5c0ba33acc:7415)
at fileEvaluate (modules-runtime.js?hash=9f9bb5e055614ddf4eb3e743737b7a5b3cfd9d34:353)
at require (modules-runtime.js?hash=9f9bb5e055614ddf4eb3e743737b7a5b3cfd9d34:248)
at admin-root.component.js (app.js?hash=16f67970c82d7408c169d90e08545f5c0ba33acc:3310)
at fileEvaluate (modules-runtime.js?hash=9f9bb5e055614ddf4eb3e743737b7a5b3cfd9d34:353)
at require (modules-runtime.js?hash=9f9bb5e055614ddf4eb3e743737b7a5b3cfd9d34:248)
at app.module.js (app.js?hash=16f67970c82d7408c169d90e08545f5c0ba33acc:7106)
at fileEvaluate (modules-runtime.js?hash=9f9bb5e055614ddf4eb3e743737b7a5b3cfd9d34:353)
at require (modules-runtime.js?hash=9f9bb5e055614ddf4eb3e743737b7a5b3cfd9d34:248)

This is my Meteor versions file:

[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
alanning:[email protected]
[email protected]
[email protected]_3
[email protected]
[email protected]_1
[email protected]_7
[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
jalik:[email protected]_1
jalik:[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
matb33:[email protected]
[email protected]
[email protected]
meteorhacks:[email protected]
meteorhacks:[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
reywood:[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
tmeasday:[email protected]
[email protected]
[email protected]
[email protected]
[email protected]
[email protected]

and this my packages.json file:

{
  "name": "shop",
  "private": true,
  "scripts": {
    "start": "meteor run"
  },
  "dependencies": {
    "@angular/animations": "^5.2.9",
    "@angular/common": "^5.2.9",
    "@angular/compiler": "^5.2.9",
    "@angular/compiler-cli": "^5.2.9",
    "@angular/core": "^5.2.9",
    "@angular/forms": "^5.2.9",
    "@angular/http": "^5.2.9",
    "@angular/platform-browser": "^5.2.9",
    "@angular/platform-browser-dynamic": "^5.2.9",
    "@angular/platform-server": "^5.2.9",
    "@angular/router": "^5.2.9",
    "@babel/runtime": "^7.0.0-beta.42",
    "@ng-select/ng-select": "^0.17.2",
    "@types/googlemaps": "^3.30.8",
    "@types/meteor-publish-composite": "0.0.32",
    "angular2-meteor-polyfills": "^0.2.0",
    "ap-angular2-fullcalendar": "^1.3.7",
    "babel-runtime": "^6.26.0",
    "bcrypt": "^1.0.3",
    "bootstrap": "^3.3.7",
    "chart.js": "^2.7.2",
    "fullcalendar": "^3.9.0",
    "gm": "^1.23.1",
    "less": "^2.7.3",
    "meteor-node-stubs": "~0.2.4",
    "meteor-rxjs": "^0.4.10",
    "moment": "^2.21.0",
    "mydatepicker": "^2.6.3",
    "mydaterangepicker": "^4.2.1",
    "ng2-currency-mask": "^4.4.1",
    "ng2-dnd": "^5.0.2",
    "ngx-infinite-scroll": "^0.8.3",
    "ngx-papaparse": "^1.2.5",
    "node-schedule": "^1.3.0",
    "reflect-metadata": "^0.1.12",
    "rxjs": "^5.5.7",
    "spawn-sync": "^1.0.15",
    "try-thread-sleep": "^1.0.2",
    "typescript": "^2.7.2",
    "typings": "^2.1.1",
    "underscore": "^1.8.3",
    "zone.js": "^0.8.20"
  },
  "devDependencies": {
    "@types/chartjs": "0.0.31",
    "@types/meteor": "^1.4.13",
    "@types/underscore": "^1.8.8",
    "meteor-typings": "^1.4.1"
  }
}

These are other compilations errors I get:

node_modules/meteor-typings/1.4/test/test.ts (691, 5): Subsequent variable declarations must have the same type.  Variable 'handle' must be of type 'LiveQueryHandle', but here has type '{ stop: () => void; }'.
node_modules/meteor-typings/1.4/test/test.ts (737, 24): Type '(userId: string) => boolean' has no properties in common with type 'Matcher'.
node_modules/rx/ts/core/es5.ts (3, 17): Duplicate identifier 'ObservableOrPromise'.
node_modules/rx/ts/core/es5.ts (5, 17): Duplicate identifier 'ArrayLike'.
node_modules/rx/ts/core/es5.ts (8, 17): Duplicate identifier 'ArrayOrIterable'.
node_modules/rx/ts/core/es6.ts (5, 17): Duplicate identifier 'ObservableOrPromise'.
node_modules/rx/ts/core/es6.ts (7, 17): Duplicate identifier 'ArrayLike'.
node_modules/rx/ts/core/es6.ts (10, 17): Duplicate identifier 'ArrayOrIterable'.
node_modules/rx/ts/core/es6.ts (20, 22): Interface 'IPromise<T>' cannot simultaneously extend types 'PromiseLike<T>' and 'Promise<T>'.
  Named property 'then' of types 'PromiseLike<T>' and 'Promise<T>' are not identical.
node_modules/rx/ts/core/observer-extras.ts (65, 39): Property 'exception' does not exist on type 'Notification<number>'.
client/imports/app/not-found.component.ts (3, 22): Cannot find module './not-found.component.html'.
[client]: TypeScript Files Compilation: 51651.520ms
[server]: HTML Files Compilation: 0.163ms    -
[server]: ES2015 modules Compilation: 1013.129ms
node_modules/rx/ts/core/linq/observable/pairs.ts (28, 5): Type 'Observable<[string, string]>' is not assignable to type 'Observable<[number, string]>'.
  Type '[string, string]' is not assignable to type '[number, string]'.
    Type 'string' is not assignable to type 'number'.
node_modules/rx/ts/core/linq/observable/pairs.ts (29, 5): Type 'Observable<[string, string]>' is not assignable to type 'Observable<[number, string]>'.
node_modules/meteor-typings/1.4/test/test.ts (691, 5): Subsequent variable declarations must have the same type.  Variable 'handle' must be of type 'LiveQueryHandle', but here has type '{ stop: () => void; }'.
node_modules/meteor-typings/1.4/test/test.ts (737, 24): Type '(userId: string) => boolean' has no properties in common with type 'Matcher'.
node_modules/rx/ts/core/es5.ts (3, 17): Duplicate identifier 'ObservableOrPromise'.
node_modules/rx/ts/core/es5.ts (5, 17): Duplicate identifier 'ArrayLike'.
node_modules/rx/ts/core/es5.ts (8, 17): Duplicate identifier 'ArrayOrIterable'.
node_modules/rx/ts/core/es6.ts (5, 17): Duplicate identifier 'ObservableOrPromise'.
node_modules/rx/ts/core/es6.ts (7, 17): Duplicate identifier 'ArrayLike'.
node_modules/rx/ts/core/es6.ts (10, 17): Duplicate identifier 'ArrayOrIterable'.
node_modules/rx/ts/core/es6.ts (20, 22): Interface 'IPromise<T>' cannot simultaneously extend types 'PromiseLike<T>' and 'Promise<T>'.
  Named property 'then' of types 'PromiseLike<T>' and 'Promise<T>' are not identical.
node_modules/rx/ts/core/observer-extras.ts (65, 39): Property 'exception' does not exist on type 'Notification<number>'.
server/admin/admin-reservations.publication.ts (368, 36): Property 'aggregate' does not exist on type 'Collection<Reservation>'.
server/admin/stats.methods.ts (43, 36): Property 'aggregate' does not exist on type 'Collection<Reservation>'.
server/admin/stats.methods.ts (84, 36): Property 'aggregate' does not exist on type 'Collection<Reservation>'.
server/admin/stats.methods.ts (125, 36): Property 'aggregate' does not exist on type 'Collection<Reservation>'.
server/admin/stats.methods.ts (168, 36): Property 'aggregate' does not exist on type 'Collection<Reservation>'.
server/reCAPTCHA.ts (32, 96): Argument of type '{ content: any; headers: { 'Content-Type': string; 'Content-Length': number; }; }' is not assignable to parameter of type 'HTTPRequest'.
  Types of property 'headers' are incompatible.
    Type '{ 'Content-Type': string; 'Content-Length': number; }' is not assignable to type '{ [id: string]: string; }'.
      Property ''Content-Length'' is incompatible with index signature.
        Type 'number' is not assignable to type 'string'.
[server]: TypeScript Files Compilation: 19101.137ms
=> Started your app.

=> App running at: http://localhost:3000/

I would appreciate any help. It is very important to me to keep up to date with Meteor releases. Thank you very much.


Solution

  • Changing the old way of importing html templates for templateUrl for all my components and switching from LESS to SASS did the trick. The app is now working with the latest version of Meteor.