Nativescript: Update to 3.4.0 and Angular 5


#1

Hi there, I am trying to upgrade my project to Nativescript 3.4 and Angular 5, I already installed the new packages but when I try to build the app with the new updates I get this error:

node_modules/nativescript-angular/dom-adapter.d.ts(3,22): error TS2420: Class 'NativeScriptDomAdapter' incorrectly implements interface 'DomAdapter'.
  Property 'getDefaultDocument' is missing in type 'NativeScriptDomAdapter'.

Here I share my package.json:

{
  "description": "My App",
  "license": "SEE LICENSE IN <your-license-filename>",
  "readme": "My App",
  "repository": "<fill-your-repository-here>",
  "nativescript": {
    "id": "org.nativescript.myapp",
    "tns-ios": {
      "version": "3.4.0"
    },
    "tns-android": {
      "version": "3.4.0"
    }
  },
  "scripts": {
    "lint": "tslint \"app/**/*.ts\""
  },
  "dependencies": {
    "@angular/animations": "5.0.0",
    "@angular/common": "5.0.0",
    "@angular/compiler": "5.0.0",
    "@angular/core": "5.0.0",
    "@angular/forms": "5.0.0",
    "@angular/http": "5.0.0",
    "@angular/platform-browser": "5.0.0",
    "@angular/router": "5.0.0",
    "kinvey-nativescript-sdk": "^3.9.2",
    "nativescript-angular": "^4.4.1",
    "nativescript-appversion": "^1.4.1",
    "nativescript-couchbase": "^1.0.18",
    "nativescript-directions": "^1.1.0",
    "nativescript-loading-indicator": "^2.4.0",
    "nativescript-phone": "^1.3.1",
    "nativescript-photoviewer": "^1.2.0",
    "nativescript-pro-ui": "^3.2.0",
    "nativescript-theme-core": "^1.0.4",
    "reflect-metadata": "0.1.10",
    "rxjs": "5.5.2",
    "tns-core-modules": "^3.4.0",
    "zone.js": "0.8.18"
  },
  "devDependencies": {
    "babel-traverse": "6.4.5",
    "babel-types": "6.4.5",
    "babylon": "6.4.5",
    "codelyzer": "3.2.2",
    "lazy": "1.0.11",
    "nativescript-dev-sass": "^1.3.2",
    "nativescript-dev-typescript": "0.5.1",
    "node-sass": "4.5.3",
    "tslint": "5.8.0",
    "typescript": "2.5.3"
  }
}

Am I missing an update?

Thanks!


#2
  1. Nuke platforms, node_modules and the package-lock.json file (delete them)
  2. Reinstall your dependencies (npm i)
  3. Upgrade nativescript-pro-ui: npm install nativescript-pro-ui@next
  4. Drop your node-sass dependency (that shouldn’t be there)
  5. Run your app

Report back if that solved your issue.


#3

"nativescript-angular": "5.0.0",

Also, you should nuke the hooks directory.


#4

Hi there, thanks for the answers, I updated "nativescript-angular": "5.0.0" and deleted hooks, platforms and node_modules. This is what I got:

***** Fatal JavaScript exception - application has been terminated. *****
Native stack trace:
1   0x10814d7b4 -[TNSRuntime executeModule:referredBy:]
2   0x106ffabd1 main
3   0x10d556d81 start
4   0x1
JavaScript stack trace:
1   require@file:///app/tns_modules/nativescript-angular/platform.js:6:41
2   anonymous@file:///app/tns_modules/nativescript-angular/platform.js:6:41
3   evaluate@[native code]
4   moduleEvaluation@[native code]
5   @[native code]
6   promiseReactionJob@[native code]
7   require@[native code]
8   anonymous@file:///app/main.js:4:25
9   evaluate@[native code]
10  moduleEvaluation@[native code]
11  @[native code]
12  promiseReactionJob@[native code]
JavaScript error:
file:///app/tns_modules/nativescript-angular/platform.js:6:41: JS ERROR Error: Could not find module '@angular/platform-browser-dynamic'. Computed path '/Users/relvis/Library/Developer/CoreSimulator/Devices/1C2D8CC6-6F28-4A51-B0B0-677C76791AFD/data/Containers/Bundle/Application/311AB3C8-CF9A-4C75-A2DF-958596E2A205/CriterionBrockMobile2.app/app/tns_modules/@angular/platform-browser-dynamic'.

Then I run, npm install and this is what I get:

npm WARN codelyzer@3.2.2 requires a peer of @angular/compiler@^2.3.1 || >=4.0.0-beta <5.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN codelyzer@3.2.2 requires a peer of @angular/core@^2.3.1 || >=4.0.0-beta <5.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN nativescript-angular@5.0.0 requires a peer of @angular/platform-browser-dynamic@~5.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN nativescript-angular@5.0.0 requires a peer of typescript@~2.4.2 but none is installed. You must install peer dependencies yourself.

Am I missing any step?

Thanks


#5

You also need to add

 "@angular/platform-browser-dynamic": "5.0.0"

to package.json.