NativeScript 5.0 has been released and it brings some exciting new features:

• Hot Module Replacement 🔥
• tns preview
• iOS Safe Area support
• Support for different app IDs for iOS and Android
• Better Vue support for NativeScript UI components
• and more...

Let's see how you can upgrade your existing Vue app (scaffolded using the vue-cli-template) to 5.0.

First, ensure you have the latest NativeScript CLI installed by running

$ npm i -g nativescript

It is a good idea to commit your changes before proceeding, in case anything goes wrong.

Open your projects package.json and make the following changes:

...
"nativescript": {
  "id": "<your app id>",
  "tns-ios": {
-    "version": "4.2.0"
+    "version": "5.0.0"
  },
  "tns-android": {
-    "version": "4.2.0"
+    "version": "5.0.0"
  }
},
...
"dependencies": {
  ...
-  "tns-core-modules": "^4.2.0",
+  "tns-core-modules": "^5.0.2"
  ...
}
...

Delete node_modules, platforms, hooks and package-lock.json

# Careful with rm -rf as it will delete files and folders!
$ rm -rf node_modules platforms hooks package-lock.json

Finally install the dependencies with

$ npm install

That's it, your app should now use NativeScript 5.0 when invoking tns run android|ios commands.

If you encounter issues, please let us know on the #vue channel on Slack.

Happy coding!