getviewbyid - ¿Cómo puedo acceder a la API nativa en NativeScript cuando uso Typescript?

nativescript 5

Question

Cuando creo dos nuevas aplicaciones con tns, una es la versión js normal y la otra es con mecanografiado. Recibo un extraño error en la versión de escritura de tipos cuando intento acceder a una biblioteca nativa.

Cuando creo una función cargada con una console.log (pow (x, y)), funciona bien con la versión js pero la versión mecanografiada falla con este error.

error TS2304: Cannot find name ''pow''.

¿Por qué?

TS:

import { EventData } from "data/observable";
import { Page } from "ui/page";
import { HelloWorldModel } from "./main-view-model";
// Event handler for Page "navigatingTo" event attached in main-page.xml
export function navigatingTo(args: EventData) {
// Get the event sender
var page = <Page>args.object;
page.bindingContext = new HelloWorldModel();
}
export function loaded() {
console.log(''Hello World'')
console.log(''pow(2.5, 3) = '', pow(2.5, 3));
}

JS:

var createViewModel = require("./main-view-model").createViewModel;
function onNavigatingTo(args) {
var page = args.object;
page.bindingContext = createViewModel();
}
function loaded() {
console.log(''hello world'')
console.log(''pow(2.5, 3) = '', pow(2.5, 3));
}
exports.onNavigatingTo = onNavigatingTo;
exports.loaded = loaded;

Answer 1

TypeScript es un lenguaje fuertemente tipado y necesita una definición de tipo explícita para cada variable (por ejemplo, como pow ). En lugar de enviar a any , puede proporcionar archivos de definición generados previamente por NativeScript que le darán la posibilidad de escribir e IntelliSense para las API nativas de Android e iOS.

La última versión de NativeScript por defecto es crear la aplicación sin los archivos de declaración de plataforma ( android17.d.ts para Android e ios.d.ts para iOS) y sin esos archivos, su TypeScript simplemente no conoce las referencias de las API nativas. La razón para no incluir los archivos de definición: son enormemente grandes y se necesitan solo cuando los desarrolladores van a usar el acceso TypeScript (o Angular) + a las API nativas.

La solución:

1.) Instalar los archivos de definición como una dependencia de desarrollador

npm i tns-platform-declarations --save-dev

Esto instalará los archivos de declaración de su plataforma en node_modules / tns-platform-declarations

2.) Cree referencias.d.ts en su directorio principal de aplicaciones y agregue lo siguiente

// SEE the updated paths below

Ahora eres bueno para ir!

ACTUALIZACIÓN (a partir de octubre de 2017: con la instalación de tns-core-modules 3.xx (o superior) y tns-platform-declaations 3.xx (o superior)): el complemento npm ahora tiene una estructura diferente, por lo que estas son las rutas adecuadas (cree el archivo references.d.ts en el directorio raíz y coloque el siguiente)

/// <reference path="./node_modules/tns-platform-declarations/ios/ios.d.ts" />
/// <reference path="./node_modules/tns-platform-declarations/android/android.d.ts" />

Importante : Tu tsconfig.json debería verse así:

{
"compilerOptions": {
"module": "commonjs",
"target": "es5",
"experimentalDecorators": true,
"lib": [
"es6",
"dom"
]
}
}