AgentSkillsCN

lint

屏幕 → 容器 → 视图的架构模式:屏幕负责数据管理,容器承担逻辑处理,视图则专注于呈现效果。在创建新功能、重构组件,或审视整体架构时,此模式皆可派上用场。

SKILL.md
--- frontmatter
name: lint
description: "Run static analysis on frontend code. Use build check to catch JS/JSX errors before running the dev server."
license: MIT
author: video-editor
version: 1.0.0
user_invocable: true

Frontend Lint

Run static analysis after making JavaScript/React code changes to catch errors early.

Usage

Invoke with /lint after editing JS/JSX files.

Quick Check

No eslint configured. Use a build check to catch errors:

bash
cd src/frontend && npm run build 2>&1 | head -50

This catches:

  • Syntax errors
  • Import errors
  • Undefined components
  • JSX errors

When to Use

  1. After editing JS/JSX files: Run build check
  2. Before committing: Verify no build errors
  3. After adding new imports: Check they resolve
  4. After runtime errors: Add checks to prevent recurrence

Common Errors This Catches

Error TypeExample
Missing importuseState not imported from React
Undefined component<ClipEditor /> but ClipEditor not imported
Syntax errorMissing closing bracket
JSX errorInvalid attribute

Type Checking (if using TypeScript)

For TypeScript files, run:

bash
cd src/frontend && npx tsc --noEmit 2>&1 | head -50