Build your own NativeScript app from TypeScript and using Telerik external modules

I am creating a simple NativeScript application and trying to do it using basic TypeScript code.

I am using Sublime Text 3 under OSX.

I figured it out by looking at the demo apps that are NativeScripttns_modules

compliant , so I added it to mine as a Git submodule and then compiled it ( ). Is this the wrong way to integrate these modules?app/

npm i && grunt

Then I realized that I could not run tns emulate android

my application from files .ts

: I had to compile them too. So I created a Grunt task to do this, but it wasn't easy to handle dependencies. I ended up with this Gruntfile.coffee

in app/

:

module.exports = (grunt) ->
    grunt.loadNpmTasks 'grunt-typescript'

    grunt.config 'typescript',
        build:
            src: [
                '**/*.ts'
                '!*_modules/**'
            ]
            options:
                references: [
                    'tns_modules/bin/dist/definitions/**/*.d.ts'
                ]
                target: 'es5'
                sourceMap: false
                declaration: false
                module: 'commonjs'
                noResolve: true

      

        
        
        
      

    

And it works with simple code like. I can extend the module, for example Observable

by writing:

import observable = require("data/observable");
class Activities extends observable.Observable {
    //...
}

      

        
        
        
      

    

Then I compile with grunt

(files .js

are created along with tags .ts

) and run with tns emulate android

(with Genymotion emulator).

Is this the right architecture for my development? When I use the Telerik platform, the compilation process is hidden, so I'm not sure if I'm doing it right.

And now I am trying to use the Telerik side-bar module directly in the page XML file, the way they do it :

<Page xmlns="http://www.nativescript.org/tns.xsd" loaded="pageLoaded" xmlns:tsb="./tns_modules/bin/dist/apps/TelerikNEXT/TelerikUI/side-bar">
    <tsb:SideBar title="MyApp">
        ...

      

        
        
        
      

    

But I am getting this error:

E / TNS.Native (2456): TypeError: Unable to read property 'android' from undefinedE / TNS.Native (2456): File: "/data/data/org.nativescript.scmobile/files/app/./tns_modules/bin / dist / apps / TelerikNEXT / TelerikUI / sidebar, line: 39, column: 39

Which matches:

this._android = new com.telerik.android.primitives.widget.sidedrawer.RadSideDrawer(this._context);

      

        
        
        
      

    

Any idea how I should include these modules? Please note that I am new to mobile devices.