arkts-development

HarmonyOS ArkTS application development with ArkUI declarative UI framework. Use when building HarmonyOS/OpenHarmony apps, creating ArkUI components, implementing state management with decorators (@State, @Prop, @Link), migrating from TypeScript to ArkTS, or working with HarmonyOS-specific APIs (router, http, preferences). Covers component lifecycle, layout patterns, and ArkTS language constraints.

Safety Notice

This listing is imported from skills.sh public index metadata. Review upstream SKILL.md and repository scripts before running.

Copy this and send it to your AI assistant to learn

Install skill "arkts-development" with this command: npx skills add fadinglight9291117/arkts_skills/fadinglight9291117-arkts-skills-arkts-development

ArkTS Development

Build HarmonyOS applications using ArkTS and the ArkUI declarative UI framework.

Quick Start

Create a basic component:

@Entry
@Component
struct HelloWorld {
  @State message: string = 'Hello, ArkTS!';

  build() {
    Column() {
      Text(this.message)
        .fontSize(30)
        .fontWeight(FontWeight.Bold)
      Button('Click Me')
        .onClick(() => { this.message = 'Button Clicked!'; })
    }
    .width('100%')
    .height('100%')
    .justifyContent(FlexAlign.Center)
  }
}

State Management Decorators

V1 (Traditional)

DecoratorUsageDescription
@State@State count: number = 0Component internal state
@Prop@Prop title: stringParent → Child (one-way)
@Link@Link value: numberParent ↔ Child (two-way, use $varName)
@Provide/@ConsumeCross-levelAncestor → Descendant
@Observed/@ObjectLinkNested objectsDeep object observation

V2 (Recommended - API 12+)

DecoratorUsageDescription
@ComponentV2@ComponentV2 struct MyCompEnable V2 state management
@Local@Local count: number = 0Internal state (no external init)
@Param@Param title: string = ""Parent → Child (one-way, efficient)
@Event@Event onChange: () => voidChild → Parent (callback)
@ObservedV2@ObservedV2 class DataClass observation
@Trace@Trace name: stringProperty-level tracking
@Computed@Computed get value()Cached computed properties
@Monitor@Monitor('prop') onFn()Watch changes with before/after
@Provider/@ConsumerCross-levelTwo-way sync across tree

See references/state-management-v2.md for complete V2 guide.

Common Layouts

// Vertical
Column({ space: 10 }) { Text('A'); Text('B'); }
  .alignItems(HorizontalAlign.Center)

// Horizontal
Row({ space: 10 }) { Text('A'); Text('B'); }
  .justifyContent(FlexAlign.SpaceBetween)

// Stack (overlay)
Stack({ alignContent: Alignment.Center }) {
  Image($r('app.media.bg'))
  Text('Overlay')
}

// List with ForEach
List({ space: 10 }) {
  ForEach(this.items, (item: string) => {
    ListItem() { Text(item) }
  }, (item: string) => item)
}

Component Lifecycle

@Entry
@Component
struct Page {
  aboutToAppear() { /* Init data */ }
  onPageShow() { /* Page visible */ }
  onPageHide() { /* Page hidden */ }
  aboutToDisappear() { /* Cleanup */ }
  build() { Column() { Text('Page') } }
}

Navigation

import { router } from '@kit.ArkUI';

// Push
router.pushUrl({ url: 'pages/Detail', params: { id: 123 } });

// Replace
router.replaceUrl({ url: 'pages/New' });

// Back
router.back();

// Get params
interface RouteParams {
  id: number;
  title?: string;
}
const params = router.getParams() as RouteParams;

Network Request

import { http } from '@kit.NetworkKit';

const req = http.createHttp();
const res = await req.request('https://api.example.com/data', {
  method: http.RequestMethod.GET,
  header: { 'Content-Type': 'application/json' }
});
if (res.responseCode === 200) {
  const data = JSON.parse(res.result as string);
}
req.destroy();

Local Storage

import { preferences } from '@kit.ArkData';

const prefs = await preferences.getPreferences(this.context, 'store');
await prefs.put('key', 'value');
await prefs.flush();
const val = await prefs.get('key', 'default');

ArkTS Language Constraints

ArkTS enforces stricter rules than TypeScript for performance and safety:

ProhibitedUse Instead
any, unknownExplicit types, interfaces
varlet, const
Dynamic property access obj['key']Fixed object structure
for...in, delete, withfor...of, array methods
#privateFieldprivate keyword
Structural typingExplicit implements/extends

See references/migration-guide.md for complete TypeScript → ArkTS migration details.

Command Line Build (hvigorw)

hvigorw is the Hvigor wrapper tool for command-line builds.

# Common build tasks
hvigorw clean                              # Clean build directory
hvigorw assembleHap -p buildMode=debug     # Build Hap (debug)
hvigorw assembleApp -p buildMode=release   # Build App (release)
hvigorw assembleHar                        # Build Har library
hvigorw assembleHsp                        # Build Hsp

# Build specific module
hvigorw assembleHap -p module=entry@default --mode module

# Run tests
hvigorw onDeviceTest -p module=entry -p coverage=true
hvigorw test -p module=entry              # Local test

# CI/CD recommended
hvigorw assembleApp -p buildMode=release --no-daemon

Common parameters:

ParameterDescription
-p buildMode={debug|release}Build mode
-p product={name}Target product (default: default)
-p module={name}@{target}Target module (with --mode module)
--no-daemonDisable daemon (recommended for CI)
--analyze=advancedEnable build analysis
--optimization-strategy=memoryMemory-optimized build

See references/hvigor-commandline.md for complete command reference.

Code Linter (codelinter)

codelinter is the code checking and fixing tool for ArkTS/TS files.

# Basic usage
codelinter                           # Check current project
codelinter /path/to/project          # Check specified project
codelinter -c ./code-linter.json5    # Use custom rules

# Check and auto-fix
codelinter --fix
codelinter -c ./code-linter.json5 --fix

# Output formats
codelinter -f json -o ./report.json  # JSON report
codelinter -f html -o ./report.html  # HTML report

# Incremental check (Git changes only)
codelinter -i

# CI/CD with exit codes
codelinter --exit-on error,warn      # Non-zero exit on error/warn
ParameterDescription
-c, --config <file>Specify rules config file
--fixAuto-fix supported issues
-f, --formatOutput format: default/json/xml/html
-o, --output <file>Save result to file
-i, --incrementalCheck only Git changed files
-p, --product <name>Specify product
-e, --exit-on <levels>Exit code levels: error,warn,suggestion

See references/codelinter.md for complete reference.

Stack Trace Parser (hstack)

hstack parses obfuscated crash stacks from Release builds back to source code locations.

# Parse crash files directory
hstack -i crashDir -o outputDir -s sourcemapDir -n nameCacheDir

# Parse with C++ symbols
hstack -i crashDir -o outputDir -s sourcemapDir --so soDir -n nameCacheDir

# Parse single crash stack
hstack -c "at func (entry|entry|1.0.0|src/main/ets/pages/Index.ts:58:58)" -s sourcemapDir
ParameterDescription
-i, --inputCrash files directory
-c, --crashSingle crash stack string
-o, --outputOutput directory (or file with -c)
-s, --sourcemapDirSourcemap files directory
--so, --soDirShared object (.so) files directory
-n, --nameObfuscationNameCache files directory

Requirements:

  • Must provide either -i or -c (not both)
  • Must provide at least -s or --so
  • For method name restoration, provide both -s and -n

See references/hstack.md for complete reference.

Code Obfuscation (ArkGuard)

Enable in build-profile.json5:

"arkOptions": {
  "obfuscation": {
    "ruleOptions": {
      "enable": true,
      "files": ["./obfuscation-rules.txt"]
    }
  }
}

Common rules in obfuscation-rules.txt:

-enable-property-obfuscation      # Property name obfuscation
-enable-toplevel-obfuscation      # Top-level scope obfuscation
-enable-filename-obfuscation      # Filename obfuscation
-keep-property-name apiKey        # Whitelist specific names

See references/arkguard-obfuscation.md for complete guide.

Reference Files

Development Environment

  • IDE: DevEco Studio
  • SDK: HarmonyOS SDK
  • Simulator: Built-in DevEco Studio emulator

Related Skills

  • Build & Deploy: See harmonyos-build-deploy skill for building, packaging, and device installation

Source Transparency

This detail page is rendered from real SKILL.md content. Trust labels are metadata-based hints, not a safety guarantee.

Related Skills

Related by shared tags or category signals.

General

harmonyos-build-deploy

No summary provided by upstream source.

Repository SourceNeeds Review
Coding

openclaw-version-monitor

监控 OpenClaw GitHub 版本更新,获取最新版本发布说明,翻译成中文, 并推送到 Telegram 和 Feishu。用于:(1) 定时检查版本更新 (2) 推送版本更新通知 (3) 生成中文版发布说明

Archived SourceRecently Updated
Coding

ask-claude

Delegate a task to Claude Code CLI and immediately report the result back in chat. Supports persistent sessions with full context memory. Safe execution: no data exfiltration, no external calls, file operations confined to workspace. Use when the user asks to run Claude, delegate a coding task, continue a previous Claude session, or any task benefiting from Claude Code's tools (file editing, code analysis, bash, etc.).

Archived SourceRecently Updated
Coding

ai-dating

This skill enables dating and matchmaking workflows. Use it when a user asks to make friends, find a partner, run matchmaking, or provide dating preferences/profile updates. The skill should execute `dating-cli` commands to complete profile setup, task creation/update, match checking, contact reveal, and review.

Archived SourceRecently Updated