IntelliSense and Code Navigation Support for Metadata Extensions¶
This topic describes about IntelliSense and code navigation features support for extension in metadata.
Two configuration files tsconfig.json
and references.d.ts
are introduced to support these features, and they’re used to support different scenarios.
tsconfig.json
: This file is used for using types defined in Mobile Development Kit SDK or NativeScript
. Import statements are needed but in a different format. Below is a sample of tsconfig.json
.
{
"compilerOptions": {
"module": "commonjs",
"target": "es5",
"noEmitHelpers": true,
"lib": [
"es6",
"dom"
],
"baseUrl": "${path-to-yourMDKClientFolder}",
"paths": {
"*": ["app/*"],
"mdk-sap":["./node_modules/mdk-sap"],
"mdk-core/*": ["./modules/mdk-core/*"],
"tns-core-modules/*": ["./node_modules/tns-core-modules/*"]
}
}
}
Customize baseUrl
in the json
file. The baseUrl
should point to your Mobile Development Kit client path.
The import statements usage is as below:
// Previous Usage
import { IControl } from './controls/IControl';
// New Usage
import { IControl } from 'mdk-core/controls/IControl';
references.d.ts
: This file is used for using NativeScript built-in types, such as UIImageView
, CGRect
, WKWebView
, and so on. Import statements aren’t needed. Below is a sample of references.d.ts
.
/// <reference path="{path-to-yourMDKClientFolder}/node_modules/@nativescript/types-ios/lib/ios.d.ts" />
/// <reference path="{path-to-yourMDKClientFolder}/node_modules/@nativescript/types-android/lib/android-31.d.ts" />
You need to change {path-to-yourMDKClientFolder} to your Mobile Development Kit client path for it to work. Then auto-completion and navigation take effect for the following sample code.
let imageView = new UIImageView({ image: image });
How to create the above mentioned configuration files
-
Command
MDK: New Application
On triggering this command, the two filestsconfig.json
andreferences.d.ts
are generated in Extensions folder of the generated Mobile Development Kit application. -
Command
MDK: Configure Extension IntelliSense
This command provides a way to create the two files for an old Mobile Development Kit application.
In file explorer view, select the node Extensions. Right-click to see this command.