Make Cursor add JSDoc comments automatically by creating .cursorrules that require documentation on all exported functions, using Cmd+K to add comments to existing code inline, and leveraging Composer to document entire files at once. Cursor generates accurate JSDoc when it can see the function's TypeScript types and implementation.
Automating Code Documentation with Cursor
Cursor can generate accurate JSDoc comments that describe parameters, return types, exceptions, and usage examples. The key is giving it clear documentation standards through rules and referencing the actual code with @file so it produces comments that match the implementation. This tutorial covers inline commenting with Cmd+K, bulk documentation with Composer, and rules that make documentation a default behavior.
Prerequisites
- Cursor installed (Free or Pro)
- A TypeScript or JavaScript project with exported functions
- Basic understanding of JSDoc comment syntax
Step-by-step guide
Add documentation rules to .cursorrules
Add documentation rules to .cursorrules
Create rules that define your documentation standards. Specify which elements need JSDoc, what tags to include, and the level of detail expected. Cursor follows these rules when generating new code and when adding comments to existing code.
1# .cursorrules23## Documentation Rules4- ALL exported functions must have JSDoc comments5- Include: @param (with type and description), @returns, @throws, @example6- Internal/private functions: brief single-line comment only7- React components: document props interface, not the component function8- Use @see for references to related functions9- Keep descriptions concise: 1-2 sentences max10- Do not document self-evident getters/setters11- Examples should be runnable TypeScript, not pseudocodeExpected result: Cursor includes JSDoc comments on all exported functions in generated code.
Add JSDoc to existing functions with Cmd+K
Add JSDoc to existing functions with Cmd+K
Select an existing function in your editor, press Cmd+K, and ask Cursor to add JSDoc. Cursor reads the function signature, parameter types, and implementation to generate accurate documentation. This is the fastest way to document individual functions.
1// Select a function in your editor, press Cmd+K and type:2// Add a JSDoc comment to this function with:3// @param tags for each parameter with type and description4// @returns with type and description5// @throws if any errors are thrown6// @example with a realistic usage examplePro tip: Select multiple functions at once (or the entire file with Cmd+A) and Cmd+K will add JSDoc to all of them in a single pass.
Expected result: The selected function gets a complete JSDoc comment block above it with all specified tags.
Document entire files with Composer
Document entire files with Composer
For bulk documentation, use Composer (Cmd+I) to add JSDoc to every exported function in a file. Reference the file with @file and specify your documentation standards. Composer handles multi-function files efficiently.
1// Prompt to type in Cursor Composer (Cmd+I):2// @src/utils/orderCalculator.ts3// Add JSDoc comments to every exported function in this file.4// For each function include:5// - Brief description (1 sentence)6// - @param for each parameter with type and purpose7// - @returns with type and what it represents8// - @throws if the function throws errors9// - @example with realistic usage10// Do NOT modify any function implementations — only add comments.Pro tip: Add 'Do NOT modify any function implementations' to prevent Cursor from changing your code while adding documentation.
Expected result: Every exported function in the file gets complete JSDoc documentation without any code changes.
Create an auto-attaching documentation rule
Create an auto-attaching documentation rule
Create a .cursor/rules/documentation.mdc that auto-attaches for all source files. This ensures documentation standards apply whenever Cursor generates or edits code, without needing to mention documentation in every prompt.
1---2description: JSDoc documentation standards3globs: "src/**/*.ts, src/**/*.tsx, lib/**/*.ts"4alwaysApply: false5---67- Every exported function MUST have JSDoc with @param, @returns, @example8- Every exported interface/type MUST have a description comment9- Every exported class MUST have a class-level JSDoc10- React components: document the Props interface, not the component11- Use @see to reference related functions in the same module12- Keep descriptions under 2 sentences13- @example code must be valid TypeScript that compilesExpected result: Documentation rules auto-attach for all TypeScript source files.
Complete working example
1/**2 * Calculates the total price for an order including all line items.3 *4 * @param order - The order containing items with prices and quantities5 * @returns The total price in cents as an integer6 * @throws {Error} If any item has a negative price7 * @example8 * ```typescript9 * const total = calculateOrderTotal({10 * items: [11 * { name: 'Widget', priceCents: 1000, quantity: 2 },12 * { name: 'Gadget', priceCents: 2500, quantity: 1 },13 * ],14 * });15 * console.log(total); // 450016 * ```17 */18export function calculateOrderTotal(order: Order): number {19 return order.items.reduce((sum, item) => {20 if (item.priceCents < 0) {21 throw new Error(`Invalid price for item: ${item.name}`);22 }23 return sum + item.priceCents * item.quantity;24 }, 0);25}2627/**28 * Applies a discount to a subtotal amount.29 *30 * @param subtotalCents - The original amount in cents31 * @param discount - The discount to apply (percentage or fixed amount)32 * @returns The discounted amount in cents, minimum 033 * @example34 * ```typescript35 * const discounted = applyDiscount(10000, { type: 'percent', value: 10 });36 * console.log(discounted); // 900037 * ```38 * @see calculateOrderTotal39 */40export function applyDiscount(41 subtotalCents: number,42 discount: Discount43): number {44 const reduction =45 discount.type === 'percent'46 ? Math.floor(subtotalCents * (Math.min(discount.value, 100) / 100))47 : discount.value;4849 return Math.max(0, subtotalCents - reduction);50}5152/** Order containing line items for price calculation. */53export interface Order {54 items: OrderItem[];55}5657/** A single line item in an order. */58export interface OrderItem {59 name: string;60 priceCents: number;61 quantity: number;62}6364/** Discount that can be applied to an order subtotal. */65export interface Discount {66 type: 'percent' | 'fixed';67 value: number;68}Common mistakes when making Cursor Add Code Comments
Why it's a problem: Asking Cursor to add comments without specifying which tags to include
How to avoid: Always specify required tags: @param, @returns, @throws, @example in your prompt or .cursorrules.
Why it's a problem: Not preventing code modifications during documentation
How to avoid: Include 'Do NOT modify any function implementations — only add comments' in your documentation prompt.
Why it's a problem: Documenting every function including trivial getters
How to avoid: Add a rule: 'Do not document self-evident getters, setters, or single-line utility functions.'
Best practices
- Create .cursorrules requiring JSDoc on all exported functions with specific tag requirements
- Use Cmd+K for quick inline documentation of individual functions
- Use Composer for bulk documentation of entire files
- Require @example tags with runnable TypeScript code for complex functions
- Document interfaces and types alongside functions for complete API documentation
- Add 'Do NOT modify implementations' to all documentation prompts
- Use auto-attaching .cursor/rules/ for consistent documentation across the project
Still stuck?
Copy one of these prompts to get a personalized, step-by-step explanation.
Add JSDoc comments to every exported function in this TypeScript file. Include @param, @returns, @throws, and @example tags. Keep descriptions concise. Do not modify any implementations.
@src/utils/orderCalculator.ts Add JSDoc to every exported function and interface. Include @param with types, @returns, @throws, @example with runnable TypeScript. Do NOT modify implementations. Keep descriptions to 1-2 sentences.
Frequently asked questions
Can Cursor add JSDoc to an entire project at once?
Not in a single prompt. Process one file at a time in Composer sessions for best results. You can create a script that lists undocumented files and process them sequentially.
Does Cursor generate accurate @example code?
Yes, when it can see the function's TypeScript types and implementation. Reference the file with @file so Cursor reads the actual signature. Examples may need minor adjustments for import paths.
Should I use JSDoc or TypeScript types for documentation?
Use both. TypeScript types handle parameter and return types. JSDoc adds descriptions, examples, and thrown error documentation that types cannot express. Cursor can generate both together.
How do I prevent Cursor from adding redundant comments?
Add a rule: 'Do not add comments that restate what the code does. Only document why, edge cases, and non-obvious behavior.' This eliminates comments like '// returns the name' above getName().
Can Cursor generate documentation in Python docstring format?
Yes. Specify 'Use Google-style Python docstrings' or 'Use NumPy docstring format' in your .cursorrules. Cursor adapts to any documentation format when instructed.
Talk to an Expert
Our team has built 600+ apps. Get personalized help with your project.
Book a free consultation