Skyline Config

Handles JSON configuration for WeChat's Skyline mini-program renderer. You'll need this when setting up new Skyline projects or migrating from WebView, since the config is mandatory but not obvious. It covers the three-tier setup: app.json for global renderer settings, per-page navigation and scroll config, and project.config.json for tooling. The main value is the forced rules section, which explains why your build fails without navigationStyle custom on every page and shows the rendererOptions you need to match WebView's default display and box model behavior. Solid reference when you're tired of hunting through Chinese docs to figure out why glass-easel won't compile.

skills.sh installs: 1K
GitHub stars: 56
last updated: Aug 21, 2026

View on GitHub

Install

$ npx -y skills add wechat-miniprogram/skyline-skills --skill skyline-config --agent claude-code

Installs into .claude/skills of the current project.

Files

Skyline JSON 配置规范

适用场景

创建新的 Skyline 小程序项目
从 WebView 迁移到 Skyline 渲染引擎
配置混合渲染（部分页面 Skyline、部分 WebView）
配置 rendererOptions 优化样式兼容性
排查 Skyline 配置相关的编译错误

核心概念

三级配置层次

层级	文件	作用	关键配置
全局	`app.json`	全局启用 Skyline	renderer, componentFramework, rendererOptions
页面	`页面.json`	页面级配置/覆盖	navigationStyle, disableScroll, renderer
工具	`project.config.json`	开发者工具调试	setting.skylineRenderEnable

最小必需配置

// app.json
{
  "renderer": "skyline",
  "componentFramework": "glass-easel",
  "lazyCodeLoading": "requiredComponents"
}

// 每个页面的 .json
{
  "navigationStyle": "custom"
}

文档索引

根据需求快速定位（路径相对于 references/）：

我想要...	查阅文档
了解 app.json 中所有 Skyline 相关配置	`app-config.md`
了解页面级配置和混合渲染	`page-config.md`
配置开发者工具	`project-config.md`
查看完整配置模板	`patterns.md`

强制规则

MUST（必须遵守）

app.json 必须包含三项必需配置：

// ❌ 错误：缺少 componentFramework 和 lazyCodeLoading
{
  "pages": ["pages/index/index"],
  "renderer": "skyline"
}

SKILL.md on GitHub

Details

Repository: github.com/wechat-miniprogram/skyline-skills
First seen: Jun 3, 2026

More from wechat-miniprogram/skyline-skills

All 7