Naily's ArkTS Support

A QQ group has been created. Feel free to join for learning and discussion (Group ID: 746153004)

This is an ArkTS VSCode extension developed based on Volar. 🌹 It appears that there has been no proper support for ArkTS in VSCode until now. Most of the existing ArkTS extensions in the VSCode marketplace are very basic, so I decided to write one myself.

Features

🌹 Starting from version 1.x, complete ArkTS language support is available, fully supporting all ArkTS syntax.
🎨 Built-in File Icon Theme: Provides the ArkTS Icons theme, supporting ArkTS file types (.ets, .json5, etc.) and common web project files (JavaScript, React, CSS, Markdown, etc.), perfect for Nx monorepos and mixed projects.
🖊️ Comprehensive JSON Schema support. Supports the following JSON Schema files:
- build-profile.json5 Module-level/Project-level configuration
- oh-package.json5 Module-level/Project-level configuration
- module.json5 Module-level/Project-level configuration
- code-linter.json5 Module-level/Project-level configuration
- All color.json files under resources/element/ for kv value configuration
- main_pages.json5file configuration
- AppScope/app.json5 file configuration
📦 Starting from version 1.x, supports installation and management of OpenHarmony SDK, and automatically detects the API version of the currently opened project, showing popup prompts for download or switch
🥇 Starting from version 1.1.6+, supports perfect $r function completion and jump, supports module.json5 file completion and jump, supports global reference query for all json files under resources/element/; supported by @arkts/project-detector hvigor project analyzer ✊
🍞 Starting from version 1.1.8+, supports module.json5 file path completion and jump, reference expression error diagnosis, requestPermissions permission completion and other new features ✨
🌾 Starting from version 1.2.10+, adds the hvigor resource explorer panel, supporting resource qualifier folder creation and resource reference indexing ✨
🎨 Starting from version 1.2.12+, adds oxk code formatting support ✨

Extension Installation 📦

Marketplace installation: https://marketplace.visualstudio.com/items?itemName=NailyZero.vscode-naily-ets
Open VSX installation: https://open-vsx.org/extension/NailyZero/vscode-naily-ets

Or simply search for ArkTS Support in VSCode.

Usage Guide 📖

Please refer to Arkcode Organization Documentation.

VSCode File Icon Theme 🖼️

Built-in ArkTS Icons Theme

This extension includes the ArkTS Icons file icon theme, providing comprehensive support for ArkTS and web development files:

Supported File Types:

ArkTS Files: .ets, .hml, .json5 config files
Web Development: JavaScript (.js, .jsx), TypeScript (.ts, .tsx), React
Styling: CSS, SCSS, SASS, LESS, HTML
Documentation: Markdown (.md, .mdx), text files
Config Files: .gitignore, .env, .eslintrc, package.json, next.config.js, etc.
Common Folders: node_modules, src, components, pages, app, etc.

How to Enable:

Open Command Palette (Cmd+Shift+P / Ctrl+Shift+P)
Type: "Preferences: File Icon Theme"
Select "ArkTS Icons"

Or set in settings.json:

{
  "workbench.iconTheme": "arkts-icons"
}

📖 Full Documentation: ArkTS File Icons Theme Guide

Material Icon Theme (Optional)

You can also use Material Icon Theme. I've submitted a PR to Material Icon Theme, and currently .ets and .d.ets files directly use the TypeScript official file icon pack. This is available in versions after upgrading to v5.22.0 👇

PR address: material-extensions/vscode-material-icon-theme#2966

Configuration

Key	Description	Type	Default
`ets.sdkPath`	%configuration.ets.sdkPath.description%	`string`	`""`
`ets.baseSdkPath`	%configuration.ets.baseSdkPath.description%	`string`	`"${os.homedir}/OpenHarmony"`
`ets.hmsPath`	%configuration.ets.hmsPath.description%	`string`	`""`
`ets.lspDebugMode`	%configuration.ets.lspDebugMode.description%	`boolean`	`false`
`ets.hdcPath`	%configuration.ets.hdcPath.description%	`string`	`""`
`ets.sdkList`	A list of installed OpenHarmony SDK paths. Keys should follow the pattern API[number] (e.g., API9, API10).	`object`	`{}`