← 返回 Skills 市场
check-vue-style
作者
yueguangshun123
· GitHub ↗
· v1.0.0
· MIT-0
137
总下载
0
收藏
0
当前安装
1
版本数
在 OpenClaw 中安装
/install check-vue-style
功能描述
检查 Vue 单文件组件(.vue)中的 CSS 样式规范问题并输出提示。用于用户提到样式规范检查、CSS 代码审查、Vue 页面样式质量巡检时。
使用说明 (SKILL.md)
Skill Instructions
适用场景
当用户希望检查 .vue 文件中的样式规范问题(如 !important 滥用、ID 选择器、非 kebab-case 类名、深度选择器、缺少 scoped)时,使用本技能。
一、快速检查流程
1) 执行样式巡检脚本
在项目根目录执行:
bash ./scripts/check-vue-style.sh
2) 理解输出结果
输出格式为:
文件路径:行号: ⚠️ 问题说明
3) 修复后复查
修复完成后再次运行同一命令,直到没有警告为止。
二、当前规则(默认内置)
脚本会对每个 .vue 文件的 \x3Cstyle> 区块执行以下检查:
- 检查是否缺少
scoped - 检查是否使用
!important - 检查是否使用 ID 选择器(如
#app) - 检查是否使用深度选择器(
/deep/、>>>、::v-deep) - 检查类名是否为 kebab-case(如
.user-card-title) - 检查样式嵌套层级是否超过 3 层(粗略规则)
三、执行约定
- 默认扫描当前目录下全部
.vue文件。 - 若脚本返回非 0,表示发现规范问题,需要提示并给出修复建议。
- 如项目已有 Stylelint,可在此脚本基础上再补充团队规则。
Resources
scripts/check-vue-style.sh
安全使用建议
This skill appears to do exactly what it says: run a local style-check over .vue files and print warnings. Before installing or running it: (1) ensure you run it from the project root (it operates on process.cwd()); (2) install Node.js if you expect to run the script (the metadata omits this requirement); (3) review the script if you have sensitive/untrusted repositories (it reads files under the repo but does not send data anywhere); (4) if you prefer an existing linter, consider using or extending Stylelint as suggested. Overall the footprint is minimal and coherent with the stated purpose.
功能分析
Type: OpenClaw Skill
Name: check-vue-style
Version: 1.0.0
The skill bundle is a legitimate utility for linting CSS styles within Vue Single File Components. The primary script, scripts/check-vue-style.sh, uses Node.js to perform local file analysis via regex to identify non-standard practices like ID selectors or missing scoped attributes, with no evidence of network access, data exfiltration, or malicious intent.
能力评估
Purpose & Capability
Skill name/description (Vue style checking) matches the included script and instructions. Minor inconsistency: metadata lists no required binaries, but the script explicitly requires Node.js and will exit if Node isn't present.
Instruction Scope
SKILL.md instructs only to run the provided local script in the project root. The script reads .vue files under the current directory (skips node_modules, .git, dist, build), reports style-related warnings, and does not access other system files, environment variables, or external endpoints.
Install Mechanism
No install spec — instruction-only plus a local script. No downloads or external installers; the script runs embedded Node code. Low install risk.
Credentials
The skill requests no environment variables or credentials. The script does not read or require secrets or config paths. (It does require a runtime dependency: Node.js.)
Persistence & Privilege
Skill does not request persistent/always-on presence, does not modify other skills or system-wide configuration, and only runs when invoked.
如何使用
- 确保已安装 OpenClaw(本地或 Docker 部署)
- 在对话框中输入安装命令:
/install check-vue-style - 安装完成后,直接呼叫该 Skill 的名称或使用
/check-vue-style触发 - 根据 Skill 的参数说明提供必要输入,即可获得结构化输出
版本历史
v1.0.0
用于自动巡检 Vue 单文件组件(.vue)中的 CSS 样式规范问题。它会扫描 <style> 区块,识别如缺少 scoped、!important 滥用、ID 选择器、深度选择器、类名非 kebab-case、嵌套层级过深等常见问题
元数据
常见问题
check-vue-style 是什么?
检查 Vue 单文件组件(.vue)中的 CSS 样式规范问题并输出提示。用于用户提到样式规范检查、CSS 代码审查、Vue 页面样式质量巡检时。 它是一个面向 Claude Code / OpenClaw 的 AI Agent Skill 插件,目前累计下载 137 次。
如何安装 check-vue-style?
在 OpenClaw 或 Claude Code 对话框中运行命令「/install check-vue-style」即可一键安装,无需额外配置。
check-vue-style 是免费的吗?
是的,check-vue-style 完全免费,采用 MIT-0 许可证,可自由下载、安装和使用。
check-vue-style 支持哪些平台?
check-vue-style 跨平台运行,可在任意部署了 OpenClaw / Claude Code 的环境中使用(cross-platform)。
谁开发了 check-vue-style?
由 yueguangshun123(@yueguangshun123)开发并维护,当前版本 v1.0.0。
推荐 Skills