NativeScript Core Modules compatibility package for building native iOS and Android apps using JavaScript and CSS
npx @tessl/cli install tessl/npm-tns-core-modules@6.5.0NativeScript Core Modules (tns-core-modules) is a compatibility package that provides the complete NativeScript framework API for building native iOS and Android mobile applications using JavaScript, TypeScript, and CSS. It delivers true native performance without WebViews by bridging JavaScript to native APIs, enabling access to platform-specific functionality through unified cross-platform interfaces.
npm install tns-core-modules// Application lifecycle and utilities
import { Application, ApplicationSettings } from "tns-core-modules";
// UI components and layouts
import { Page, StackLayout, Button, Label } from "tns-core-modules";
// Data handling
import { Observable, ObservableArray } from "tns-core-modules";
// File system and HTTP
import { File, Folder, Http } from "tns-core-modules";
// Performance monitoring and debugging
import { Profiling, Trace } from "tns-core-modules";
// Utility functions and platform services
import { Utils, Connectivity, Color } from "tns-core-modules";
// XML parsing
import { XmlParser, ParserEventType } from "tns-core-modules";For CommonJS:
const { Application, Page, Button } = require("tns-core-modules");import { Application, Page, StackLayout, Button, Label } from "tns-core-modules";
// Application setup
Application.run({ moduleName: "main-page" });
// Create a simple page with UI
export function createPage() {
const page = new Page();
const stack = new StackLayout();
const label = new Label();
label.text = "Hello NativeScript!";
const button = new Button();
button.text = "Click Me";
button.on("tap", () => {
label.text = "Button tapped!";
});
stack.addChild(label);
stack.addChild(button);
page.content = stack;
return page;
}NativeScript Core Modules provides several key architectural components:
Core application lifecycle, navigation, and configuration management for NativeScript apps.
namespace Application {
// Application lifecycle events
const launchEvent: string;
const suspendEvent: string;
const resumeEvent: string;
const exitEvent: string;
// Core application functions
function run(entry?: any): void;
function getRootView(): View;
function orientation(): string;
function hasLaunched(): boolean;
// Platform-specific instances
const android: AndroidApplication;
const ios: iOSApplication;
}
namespace ApplicationSettings {
function setString(key: string, value: string): void;
function getString(key: string, defaultValue?: string): string;
function setBoolean(key: string, value: boolean): void;
function getBoolean(key: string, defaultValue?: boolean): boolean;
function clear(): void;
}Comprehensive set of native UI components including buttons, labels, inputs, and advanced controls like lists and navigation.
// Core UI base classes
class ViewBase {
id: string;
className: string;
style: Style;
parent: ViewBase;
isLoaded: boolean;
on(eventName: string, callback: Function): void;
off(eventName: string, callback?: Function): void;
}
class View extends ViewBase {
width: number | string;
height: number | string;
visibility: string;
opacity: number;
}
// Layout containers
class StackLayout extends LayoutBase {
orientation: string;
}
class GridLayout extends LayoutBase {
columns: string;
rows: string;
}
// UI controls
class Button extends View {
text: string;
tap: string; // event name
}
class Label extends View {
text: string;
textWrap: boolean;
}Reactive data handling with Observable pattern supporting two-way data binding and change notifications.
class Observable {
constructor(obj?: any);
get(name: string): any;
set(name: string, value: any): void;
on(eventName: string, callback: Function): void;
off(eventName: string, callback?: Function): void;
notify(data: PropertyChangeData): void;
}
class ObservableArray<T> extends Array<T> {
constructor(...items: T[]);
push(...items: T[]): number;
pop(): T;
splice(start: number, deleteCount?: number, ...items: T[]): T[];
on(eventName: string, callback: Function): void;
}
interface PropertyChangeData {
object: Observable;
propertyName: string;
value: any;
oldValue: any;
}Cross-platform file system access for reading, writing, and managing files and folders on mobile devices.
class File extends FileSystemEntity {
static fromPath(path: string): File;
readText(encoding?: string): Promise<string>;
writeText(content: string, encoding?: string): Promise<void>;
readTextSync(encoding?: string): string;
writeTextSync(content: string, encoding?: string): void;
}
class Folder extends FileSystemEntity {
static fromPath(path: string): Folder;
getFile(name: string): File;
getFolder(name: string): Folder;
getEntities(): Promise<FileSystemEntity[]>;
eachEntity(onEntity: Function): void;
}
namespace knownFolders {
const documents: Folder;
const temp: Folder;
const currentApp: Folder;
}Full-featured HTTP client for REST API calls, file downloads, and network communication.
namespace Http {
function request(options: HttpRequestOptions): Promise<HttpResponse>;
function getJSON<T>(url: string): Promise<T>;
function getString(url: string): Promise<string>;
function getFile(url: string, destinationFilePath?: string): Promise<File>;
function getImage(url: string): Promise<ImageSource>;
}
interface HttpRequestOptions {
url: string;
method?: string;
headers?: any;
content?: string | any;
timeout?: number;
}
interface HttpResponse {
statusCode: number;
content: HttpContent;
headers: any;
}Comprehensive image loading, manipulation, and caching capabilities for mobile applications.
class ImageSource {
static fromFile(path: string): ImageSource;
static fromData(data: any): ImageSource;
static fromBase64(source: string): ImageSource;
saveToFile(path: string, format: string, quality?: number): boolean;
toBase64String(format: string, quality?: number): string;
}
class ImageAsset {
constructor(asset: any);
getImage(options?: ImageAssetOptions): Promise<ImageSource>;
}
interface ImageAssetOptions {
maxWidth?: number;
maxHeight?: number;
aspectRatio?: string;
autoScaleFactor?: boolean;
}Device information, platform detection, and native utility functions for iOS and Android integration.
// Platform detection
function isAndroid(): boolean;
function isIOS(): boolean;
// Device information
interface Device {
model: string;
deviceType: string;
os: string;
osVersion: string;
sdkVersion: string;
language: string;
region: string;
}
// Screen information
interface Screen {
mainScreen: ScreenMetrics;
widthDIPs: number;
heightDIPs: number;
scale: number;
}
// Utility functions
namespace Utils {
function executeOnMainThread(func: Function): void;
function isMainThread(): boolean;
function openUrl(url: string): boolean;
function openFile(filePath: string): boolean;
}Performance monitoring and profiling tools for measuring method execution times, memory usage, and application performance metrics.
namespace Profiling {
// Core profiling controls
function enable(type?: InstrumentationMode): void;
function disable(): void;
function isRunning(name: string): boolean;
// Timer functions
function time(): number;
function uptime(): number;
function start(name: string): void;
function stop(name: string): TimerInfo;
// Profile management
function dumpProfiles(): void;
function resetProfiles(): void;
function profile(name?: string): MethodDecorator;
function profile<F extends Function>(fn: F): F;
function profile<F extends Function>(name: string, fn: F): F;
// CPU profiling (Android)
function startCPUProfile(name: string): void;
function stopCPUProfile(name: string): void;
}
type InstrumentationMode = "counters" | "timeline" | "lifecycle";
interface TimerInfo {
totalTime: number;
count: number;
}Debug tracing and logging system with category-based filtering and multiple output writers for comprehensive application debugging.
namespace Trace {
// Core trace controls
function enable(): void;
function disable(): void;
function isEnabled(): boolean;
// Writer management
function addWriter(writer: TraceWriter): void;
function removeWriter(writer: TraceWriter): void;
function clearWriters(): void;
// Category management
function setCategories(categories: string): void;
function addCategories(categories: string): void;
// Logging functions
function write(message: any, category: string, type?: number): void;
function error(error: string | Error): void;
// Event handling
function setErrorHandler(handler: ErrorHandler): void;
// Predefined categories
const categories: {
VisualTreeEvents: string;
Layout: string;
Style: string;
ViewHierarchy: string;
NativeLifecycle: string;
Debug: string;
Navigation: string;
Test: string;
Binding: string;
Error: string;
Animation: string;
Transition: string;
All: string;
};
// Message types
const messageType: {
log: number;
info: number;
warn: number;
error: number;
};
}
interface TraceWriter {
write(message: any, category: string, type?: number): void;
}
interface ErrorHandler {
handlerError(error: Error): void;
}Network connection monitoring and detection capabilities for managing network-dependent application behavior.
namespace Connectivity {
// Connection detection
function getConnectionType(): number;
function startMonitoring(callback: (newConnectionType: number) => void): void;
function stopMonitoring(): void;
// Connection types
const connectionType: {
none: 0;
wifi: 1;
mobile: 2;
ethernet: 3;
bluetooth: 4;
vpn: 5;
};
}Color creation and manipulation utilities supporting multiple color formats and platform-specific representations.
class Color {
constructor(knownColor: string);
constructor(hex: string);
constructor(argb: number);
constructor(alpha: number, red: number, green: number, blue: number);
// Color components (read-only)
readonly a: number; // Alpha (0-255)
readonly r: number; // Red (0-255)
readonly g: number; // Green (0-255)
readonly b: number; // Blue (0-255)
// Color representations (read-only)
readonly hex: string;
readonly argb: number;
readonly name: string;
readonly android: number;
readonly ios: any; // UIColor
// Utility methods
equals(value: Color): boolean;
static equals(value1: Color, value2: Color): boolean;
static isValid(value: any): boolean;
}SAX-based XML parsing with event-driven processing and namespace support for handling XML data and documents.
class XmlParser {
constructor(
onEvent: (event: ParserEvent) => void,
onError?: (error: Error, position: Position) => void,
processNamespaces?: boolean,
angularSyntax?: boolean
);
parse(xmlString: string): void;
}
class ParserEventType {
static StartElement: string;
static EndElement: string;
static Text: string;
static CDATA: string;
static Comment: string;
}
interface ParserEvent {
eventType: string;
position: Position;
prefix?: string;
namespace?: string;
elementName?: string;
attributes?: any;
data?: string;
toString(): string;
}
interface Position {
line: number;
column: number;
}