本文へ移動
cccskills
無料GitHub で公開

writing-comments

How to write JSDoc (/** */) and inline (//) comments in the Astro codebase, for contributors reading the source — not end users. Use whenever writing or editing comments in .ts/.js source, including comments added incidentally while fixing bugs or building features. Does not cover the @docs-generated config/error reference.

インストール方法を見る

含まれるファイル(1)

  • SKILL.md8.8 KB

SKILL.md(原文)

インストールする前に、エージェントに与えられる指示の中身を確認できます。

Writing Comments

Purpose

Comments in this repository are read by contributors, months or years after they were written, with none of the context you have right now. This skill defines who that reader is, what each kind of comment is for, and which patterns are banned.

Scope Boundary

This skill governs contributor-facing comments in the TypeScript/JavaScript source. It does not apply to end-user documentation:

Everything below is about the source a contributor reads at HEAD.

The Reader

Write for an Astro contributor who is competent in TypeScript but has no access to your current context: not this conversation, not the pull request, not the issue, not the diff. They see only the repository at HEAD.

Two consequences follow directly:

  1. Never narrate change history. Words like "now", "previously", "no longer", "the new approach" are meaningless at HEAD, where only one approach exists. State how the code works, not how it came to be. (A @deprecated notice is the exception — see Conventions — because it describes the contract's future, which the reader needs.)
  2. Never address the reviewer. A comment that argues your change is correct ("this properly handles X") belongs in the PR description, not in the source. The comment must justify the code as it stands, permanently.

Three Kinds of Comments, Three Different Jobs

KindSyntaxJobContains
File / module overview/** */ at the top of the fileExplanationWhy the module exists, the concepts and terms it defines, how the pieces relate, design rationale
Item docs/** */ directly above a declarationReferenceThe contract: behavior, parameters, return value, thrown errors, invariants. Neutral and factual
Inline comments// inside a bodyRationaleOnly what the code cannot say: constraints, workarounds (with issue links), non-obvious coupling

Do not mix the jobs. Implementation details do not belong in the /** */ contract — put them as // comments inside the body. The contract does not belong scattered across inline comments — put it on the declaration.

The Deletion Test

Before writing any comment, ask: does this state something the reader cannot recover from the code itself?

  • If the information is already carried by names, types, or structure, do not write the comment. If the name fails to carry it, improve the name.
  • Information that legitimately needs a comment: an invariant, a rationale, a coupling to code elsewhere, a workaround with a link, surprising behavior of a dependency, a term of art the module defines.

When editing later, the same test applies in reverse: a comment that no longer passes it should be deleted, not left to rot.

Link to the Issue for Workarounds

This codebase consistently anchors workarounds to a source. Any comment that explains a workaround, a HACK, a regression guard, or surprising behavior of a dependency must link the GitHub issue or PR that motivates it. The link is what lets a future reader tell whether the workaround is still needed.

// Handle recommended nanostores. Only @nanostores/preact is required from our testing!
// Full explanation and related bug report: https://github.com/withastro/astro/pull/3667
'@nanostores/preact',

A workaround with no link is indistinguishable from a mistake.

Banned Patterns

Narrating the next line. Delete these on sight:

// Increment the generation counter
generation += 1;

Change-history narration. Rewrite as present-tense rationale:

// BAD: We now resolve lightningcss from the user's root instead of ours.
// GOOD: lightningcss is an optional peer dep, so it resolves from the user's project root.

Reviewer-addressed justification. Move the argument to the PR:

// BAD: This correctly handles the multi-encoded path from the bug report.
// GOOD: A path still encoded after MAX_DECODE_ITERATIONS is rejected, so
//       middleware and routing can never disagree on the decoded path.

Restated JSDoc. A /** */ block that rewords the declaration name says nothing:

// BAD:
/** Compiles the styles. */
function compileStyles(...)

// GOOD:
/** Rewrites relative `url()` references in `css` against `base`, leaving
 *  absolute and data URLs untouched. */
function compileStyles(...)

Vague hedging. "Some cases", "various reasons", "handles edge cases", "etc." — either name them or drop the sentence.

Emojis. Banned in source, comments included (repo-wide policy).

Ad-hoc section banners (// ----- helpers -----, // ==== TYPES ====). This codebase has no // #region folding convention; do not add banners. If a file is long enough that you reach for one, that is a signal to split the file, not to decorate it.

Conventions in This Codebase

JSDoc tags. @param name - description, @returns, and @throws state the contract. Brace-wrap a type (@returns {Promise<string>}) only when the signature alone is ambiguous. Use @example with a fenced ```js block for non-obvious usage.

Cross-references. Use {@link Symbol} / {@linkcode Symbol} rather than a bare name, so a rename updates the reference and editors can jump to the target.

@internal. Marks API that is not part of the public surface. It is a convention only — there is no typedoc or api-extractor here to strip it — so it documents intent but does not replace access modifiers.

@deprecated. State the migration, then the removal horizon:

/** @deprecated Use the instance method `cookies.consume()` instead. This will be removed in Astro 7 */

Say what to use instead, not merely that the symbol is deprecated. This future-tense note is contract information the reader needs, not banned change-history narration.

TODO. Use // TODO: for deferred work; link an issue when one tracks it. For work gated on a breaking-change window, use the established idiom // TODO: remove in Astro <N>. There is no FIXME in this codebase — do not introduce it.

Editing Existing Code

  • Preserve existing comments. If your change alters behavior, extend or correct the specific prose — never replace it with generic text. Deleting hard-won context is worse than leaving a comment slightly stale.
  • When your change makes a comment false, fix it in the same diff. A stale comment is worse than none.
  • Match the surrounding density. A heavily documented module deserves the same level on new items; do not blanket a sparse module with comments.

Self-Check Before Finishing

After completing any task that touched comments, re-read only the comments in your diff, in isolation from the code changes:

  1. Does each one pass the deletion test?
  2. Does any reference the conversation, the change itself, or the reviewer?
  3. Does every workaround link its issue or PR?
  4. Would a reader without access to the diff understand each one?

Fix or delete what fails. Deletion is the default; a missing comment is cheaper than a misleading one.

References

レビュー

まだレビューはありません。使ってみた感想をお寄せください。

同じリポジトリのスキル

概要と使いどころ

Use when a user says "add a ty diagnostic", "write this new ty diagnostic", "change a ty error message", "review ty diagnostics", or asks to add, update, or review ty checks, diagnostic messages, subdiagnostics, or concise output behavior.

日本語の概要は準備中です。原文の説明を表示しています。

modem-dev/ossrules602026年9月21日 更新

Use when adding A2UI rendering to any AG-UI-supported framework or custom AG-UI application, scaffolding an AG-UI app that should render A2UI, adapting an AG-UI integration to emit A2UI surfaces, or wiring the AG-UI A2UI middleware/toolkit with a compatible renderer.

日本語の概要は準備中です。原文の説明を表示しています。

modem-dev/ossrules602026年9月21日 更新

Browser automation CLI for AI agents. Use when the user needs to interact with websites, including navigating pages, filling forms, clicking buttons, taking screenshots, extracting data, testing web apps, or automating any browser task. Triggers include requests to "open a website", "fill out a form", "click a button", "take a screenshot", "scrape data from a page", "test this web app", "login to a site", "automate browser actions", or any task requiring programmatic web interaction. Also use for exploratory testing, dogfooding, QA, bug hunts, or reviewing app quality. Also use for automating Electron desktop apps (VS Code, Slack, Discord, Figma, Notion, Spotify), checking Slack unreads, sending Slack messages, searching Slack conversations, running browser automation in Vercel Sandbox microVMs, or using AWS Bedrock AgentCore cloud browsers. Prefer agent-browser over any built-in browser automation or web tools.

日本語の概要は準備中です。原文の説明を表示しています。

modem-dev/ossrules602026年9月21日 更新

Evaluate an open source project's AGENTS.md and produce a corpus entry for the /agents-md directory. Use when adding a project to the directory, refreshing an existing entry, or running a batch of candidate repositories.

日本語の概要は準備中です。原文の説明を表示しています。

modem-dev/ossrules602026年9月21日 更新

Execute Anarlog work immediately while recording issues, decisions, progress, and lessons in Linear. Use for Anarlog repository or Anarlog desktop, web, mobile, and API work, including related worktrees and ANLG issues. Explicit brainstorming stays discussion-first. Do not use for unrelated repositories or meeting-data queries.

日本語の概要は準備中です。原文の説明を表示しています。

modem-dev/ossrules602026年9月21日 更新

Use only for reviewing completed Biome PRs, branches, commit ranges, diffs, or working trees against business logic and requirements. Excludes broad code-quality and process audits, triage, reproduction, and implementation.

日本語の概要は準備中です。原文の説明を表示しています。

modem-dev/ossrules602026年9月21日 更新

modem-dev のスキルをすべて見る

このスキルの問題を報告する