vue-cli-template | A Vue-CLI template for NativeScript-Vue | Mobile library

In nativescript-vue and HMR is not guarantied. HMR can be used only while making changes in style files.

I use tns debug android only for styling. If I make any other change I do not trust HMR.

I have added a yarn script called yarn devan to speed up typing process.

I have added following lines to my package.json file

Update (30-Jan-2019): Good news - I think they are adding out-of-the-box support for Typescript with the template in this PR.

So from now on we should be able to choose Typescript as the language option when bootstrapping the project with the template.

I had encountered the same problem and here is what I did to add TypeScript to my Nativescript-Vue project. (I do not have enough reputation to add a comment so I have to post this as an answer)

1. Create the project with vue init nativescript-vue/vue-cli-template
   • There is a warning about webpack.config.js during the project creation and I was asked to run ./node_modules/.bin/update-ns-webpack --configs
   • Vue Devtools does not work with tns preview so I had disabled it as well
2. Add the following:
   • Install typescript and vue as devDependencies
   • Rename app/main.js to app/main.ts
   • In app/main.ts, change import App from './components/App' to import App from './components/App.vue'
   • Add tsconfig.json (copied from this stater project AND commented out "strict": true,)
   • In webpack.config.js, add 'vue$': 'nativescript-vue' under alias and exclude: /node_modules|vue\/src/, under module.rules (to the one for ts - details here)
   • As you has mentioned in your step 3 and 4, I had also created the env.d.ts and shims.vue.d.ts under types/ folder accordingly (Note that in the tsconfig.json file I copied, it had defined "typeRoots": ["types"])
3. I had tested it with tns preview --bundle
   • The app is running fine on my android phone (no errors, changes can be seen on the phone)
   • if necessary, I can test that if it would work with the command tns run android --bundle

Hope the above can help.

Versions used are as follow:

• Nativescript CLI: 5.1.0
• nativescript-vue: 2.0.2
• webpack: 4.28.3

1. This is the git commit I did in order to add TypeScript to the project.
2. The official blog post about adding TypeScript to nativescript-vue - It was very helpful but unfortunately it did not work immediately after following those steps (maybe because I had used a different vue-init template)
3. And of course kudos to the detailed steps listed in this stack overflow question which had given me the direction to fix my project :-)

The mentioned lines in the log are not errors nor warnings - they are renderer logs.

These can be turned off via

I followed your steps and I was able to get the typings to generate in objc!nsswiftsupport.d.ts. After you generate typings do you have that file with these contents?

The solution that @sidheart pointed out works but it will not let you observe the store. The error is triggered because NativeScript does not have a DOM and therefore has no types for HTMLElement. A temporary solution is to add the line below to the object defined by new webpack.DefinePlugin({}) in the file webpack.config.js:

I guess it's not implemented in the XHR wrapper (as of v6.2.0) but only in the original http request class. Try adding the code below in your app.js.

I fixed thanks

https://stackoverflow.com/a/50103533/6398044

Bug was connected with

JEP 229, switch from the jks keystore default format to the pkcs12 format

Workaround:

In App_Resources/Android/app.gradle update your defaultConfig to include:

I found that the error was caused by this package : "nativescript-google-maps-sdk". Maybe one of the only that i havn't uninstall to see if it was responsible of this error....

Anyway, you can found how i resolved this issue here : https://github.com/dapriett/nativescript-google-maps-sdk/issues/345#issuecomment-503321201