lint-new

작성자: sentry

ESLint 규칙을 위한 새로운 린트 규칙을 생성합니다. "린트 규칙 생성", "ESLint 규칙 추가", "규칙 스캐폴드", "새로운 규칙 작성" 등의 요청 시 사용하세요.

npx skills add https://github.com/getsentry/sentry --skill lint-new

Create a new ESLint rule named $ARGUMENTS in the eslintPluginScraps plugin.

Step 1: Choose Your Archetype

Read references/rule-archetypes.md and pick the archetype that matches your rule's intent:

You want to...ArchetypeReference to load
Rewrite import pathsImport rewriteInline — simple pattern
Validate token/value usage per CSS propertyProperty validationstyle-collector-guide.md
Restrict JSX elements in specific propsJSX structuralrule-archetypes.md §Archetype 3
Detect patterns in static CSS textTemplate text analysisrule-archetypes.md §Archetype 4

Read the relevant reference before writing code. The archetypes document which AST visitors to use, which shared utilities apply, and which patterns are NOT appropriate for each approach.

Step 2: Check Shared Utilities

Before writing AST traversal logic, check static/eslint/eslintPluginScraps/src/ast/ for reusable code:

UtilityLocationUse for
getStyledCallInfosrc/ast/utils/styled.tsClassifying styled/css calls as element, component, or css
createQuasiScannersrc/ast/scanner/index.tsScanning static CSS text in template literals (Archetype 4)
createImportTrackersrc/ast/tracker/imports.tsResolving where a local name was imported from
createStyleCollectorsrc/ast/extractor/index.tsCollecting CSS-in-JS dynamic value declarations (NOT static text)
shouldAnalyzesrc/ast/extractor/index.tsFast pre-scan to skip files without Emotion usage
normalizePropertyNamesrc/ast/utils/normalizePropertyName.tsNormalizing CSS property names
decomposeValuesrc/ast/extractor/value-decomposer.tsBreaking complex expressions into all possible values
Theme trackersrc/ast/tracker/theme.tsTracking useTheme() and callback theme bindings

If another rule already solves a similar problem, extract shared logic into src/ast/utils/ and reuse it.

Step 3: Create Files

  1. Rule: static/eslint/eslintPluginScraps/src/rules/$ARGUMENTS.ts
  2. Test: static/eslint/eslintPluginScraps/src/rules/$ARGUMENTS.spec.ts

Rule Template

import {ESLintUtils} from '@typescript-eslint/utils';

export const $RULE_NAME = ESLintUtils.RuleCreator.withoutDocs({
  meta: {
    type: 'problem',
    docs: {
      description: '[Rule description]',
    },
    fixable: 'code', // include if rule has autofix — see Autofix Guidance
    schema: [],
    messages: {
      forbidden: 'Error message shown to user',
    },
  },
  create(context) {
    return {
      // AST visitor methods — see your chosen archetype
    };
  },
});

If your rule needs configurable options, load references/schema-patterns.md.

Test Template

import {RuleTester} from '@typescript-eslint/rule-tester';

import {$RULE_NAME} from './$ARGUMENTS';

const ruleTester = new RuleTester();

ruleTester.run('$ARGUMENTS', $RULE_NAME, {
  valid: [
    {
      code: '// valid code',
      filename: '/project/src/file.tsx',
    },
  ],
  invalid: [
    {
      code: '// invalid code',
      filename: '/project/src/file.tsx',
      errors: [{messageId: 'forbidden'}],
      output: '// expected output after autofix', // REQUIRED for fixable rules
    },
  ],
});

Run tests:

pnpm test-ci "static/eslint/eslintPluginScraps/src/rules/$ARGUMENTS.spec.ts"

Autofix Guidance

Default stance: implement autofix unless the transformation is ambiguous or could change runtime behavior.

Safe autofix patterns

  • Import path rewrites (see no-core-import.ts as canonical example)
  • Adding/removing JSX attributes with known values
  • Wrapping expressions in a known component
  • Identifier renames with no shadowing risk

Do NOT autofix when

  • Multiple valid fixes exist and the right choice requires human judgment
  • The fix requires type information not available from the AST alone
  • The transformation alters control flow or runtime behavior
  • The change spans multiple files

Fixer API

context.report({
  node,
  messageId: 'forbidden',
  fix(fixer) {
    return fixer.replaceText(node, newText);
    // Also: fixer.replaceTextRange([start, end], text)
    //        fixer.insertTextBefore(node, text)
    //        fixer.insertTextAfter(node, text)
    //        fixer.remove(node)
    // Return single fix or array of fixes
  },
});

When a rule is fixable, every invalid test case MUST include output showing the expected code after the fix.

Step 4: Register the Rule

1. Rule Index

Add to static/eslint/eslintPluginScraps/src/rules/index.ts:

import {$RULE_NAME} from './$ARGUMENTS';

export const rules = {
  // existing rules...
  $ARGUMENTS: $RULE_NAME,
};

2. ESLint Config

Add to eslint.config.ts inside the name: 'plugin/@sentry/scraps' block:

'@sentry/scraps/$ARGUMENTS': 'error',
// or with options:
'@sentry/scraps/$ARGUMENTS': ['error', { /* options */ }],

3. Verify

pnpm test-ci "static/eslint/eslintPluginScraps/src/rules/$ARGUMENTS.spec.ts"

Extending an Existing Rule

If modifying an existing rule rather than creating a new one:

  1. Read the existing rule and its config files to understand the architecture
  2. For config-driven rules (like use-semantic-token): changes often only require editing the config file (e.g., src/config/tokenRules.ts), not the rule logic
  3. Watch for reverse-mapping side effects — adding a new category can change which category is suggested for shared properties (last writer wins in buildPropertyToRule)
  4. Update existing tests for any changed behavior, then add new test cases

Naming Convention

  • Rule name (kebab-case): my-rule-name — verb-noun pattern (e.g., no-token-import, use-semantic-token)
  • Export name (camelCase): myRuleName
  • File name: matches rule name exactly (my-rule-name.ts, my-rule-name.spec.ts)

sentry의 다른 스킬

generate-frontend-forms
sentry
Sentry의 새로운 폼 시스템을 사용하여 폼을 생성하는 가이드입니다. 폼, 폼 필드, 유효성 검사 또는 자동 저장 기능을 구현할 때 사용하세요.
official
sentry-snapshots-cocoa
sentry
Apple/Cocoa 프로젝트를 위한 전체 Sentry Snapshots 설정입니다. "SnapshotPreviews 설정", "Apple 스냅샷 테스트 설정", "Apple 스냅샷 업로드" 요청 시 사용하세요.
official
architecture-review
sentry
직원 수준의 코드베이스 건강 검토. 모놀리식 모듈, 무음 실패, 타입 안전성 격차, 테스트 커버리지 구멍, LLM 친화성 문제를 찾습니다.
official
linear-type-labeler
sentry
Linear 이슈를 분류하고, 각 이슈의 제목과 설명 내용을 기반으로 Sentry 워크스페이스의 레이블 분류 체계에서 Type 레이블을 적용합니다.
official
sentry-flutter-sdk
sentry
Flutter 및 Dart를 위한 완전한 Sentry SDK 설정입니다. "Flutter에 Sentry 추가", "sentry_flutter 설치", "Dart에서 Sentry 설정" 또는 오류 구성을 요청받았을 때 사용하세요.
official
sentry-svelte-sdk
sentry
Svelte 및 SvelteKit을 위한 완전한 Sentry SDK 설정입니다. "Svelte에 Sentry 추가", "SvelteKit에 Sentry 추가", "@sentry/sveltekit 설치" 또는 구성 요청 시 사용하세요.
official
vercel-react-best-practices
sentry
Vercel Engineering의 React 및 Next.js 성능 최적화 가이드라인입니다. 이 스킬은 React/Next.js 코드를 작성, 검토 또는 리팩토링할 때 사용해야 합니다.
official
sentry-tanstack-start-sdk
sentry
TanStack Start React용 전체 Sentry SDK 설정. "TanStack Start에 Sentry 추가", "@sentry/tanstackstart-react 설치" 또는 오류 구성 요청 시 사용…
official