用途
Skyline WXSS 样式支持技能用于查询和检查 WXSS/CSS 在 Skyline 渲染引擎下的支持情况,帮助定位样式不生效的原因,并在迁移或编写样式时确认属性与取值是否可用。
适用场景包括:检查某个 CSS 属性/值在 Skyline 下是否可用;排查 WXSS 样式在 Skyline 下不生效的问题;从 WebView 迁移到 Skyline 时评估样式兼容性;使用渐变、滤镜、遮罩等高级样式时了解限制;查阅 Skyline 支持的 CSS 属性语法。
主要能力
文档按主题提供参考索引:基础数据类型与语法符号见 references/basics.md;布局、定位与盒模型见 references/layout.md;Flex 布局见 references/flex.md;背景、边框、滤镜与遮罩见 references/visual.md;文本与字体见 references/text.md;动画、过渡与变换见 references/animation.md。
技能还给出属性支持速查,例如布局方面 display 支持 none、block、inline、inline-block、flex、inline-flex,不支持 grid、flow-root;position 支持 static、relative、absolute、fixed,不支持 sticky;overflow 支持 visible、hidden,不支持 auto、scroll。文本、边框与背景等也有对应速查表。
文档列出了不支持的属性及替代方案,例如 float 建议改用 flex 布局,contain 改用 -wx-contain,text-indent 用 padding-left 模拟,overflow-wrap 改用 word-break,resize、writing-mode、background-attachment 等无替代。
文档还说明了部分属性可用但特定值不支持(会被静默忽略)、渐变与滤镜限制、背景与遮罩多值限制、calc() 不支持角度、text-overflow 仅在 text 组件生效、filter 不支持 url() 与 drop-shadow()、text-decoration-line 仅支持单值、mask-image 渐变不可用、简写属性部分子属性不生效等规则,并提示 Skyline 在 display、position、box-sizing、flex-direction、align-items、text-align、mask-repeat 等属性上的默认值与 Web 标准不同。
使用方式
文档要求调用 skyline CLI 对 WXSS 进行检查,确保用法正确:
列出所有支持的 WXSS 属性:
npx skyline-cli wxss list
从 stdin 读取 WXSS 文本并检查语法:
echo "view { color: red; }" | npx skyline-cli wxss check --json
检查小程序工程内的 WXSS 文件:
npx skyline-cli wxss check --json --miniprogram-root ${PROJECT_ROOT} --files pages/index/index.wxss pages/list/list.wxss
查看 CLI 帮助:
npx skyline-cli --help
文档还推荐了相关技能:Skyline JSON 配置见 skyline-config(rendererOptions 影响默认 display/flex-direction/align-items/box-sizing);组件使用见 skyline-components(scroll-view 替代 overflow:auto);Worklet 动画见 skyline-worklet;Skyline 概览与迁移指南见 skyline-overview。
限制
具体价格、平台、收费等信息暂未提供。