Space after function name in declarations
Problem
NOTE: This issue is raised due to confusion in #1139. NOTE: Feel free to use the 👍 and 👎 buttons to indicate your preferences, but please refrain from commenting unless you’ve read every comment and made sure yours says something that has _not_ been said before. This issue is _only_ about outputting these spaces: [code block] (Prettier currently does _not_ put spaces in those positions.) > 🗒 NOTE: This issue is _not_ about anonymous functions: > > [code block] > > Anonymous functions are tracked in #3847! The key arguments is: Searchability: You can find any function or method declaration my searching for e.g. `method (` or `identity <`, or even just `name[space]` (mostly). It also provides a clear and immediate difference between _declaration_ and _invocation_. (There are many existing comments in favour of this style, notably: https://github.com/prettier/prettier/issues/1139#issuecomment-316096507 and the majority of the discussion from https://github.com/prettier/prettier/issues/1139#issuecomment-361515396 onwards.)
Unverified for your environment
Select your OS to check compatibility.
1 Fix
Implement Space After Function Names in Declarations
The current formatting rules in Prettier do not include spaces after function names in declarations, leading to confusion when searching for function declarations versus invocations. This lack of spacing makes it difficult for developers to quickly identify function declarations in the codebase.
Awaiting Verification
Be the first to verify this fix
- 1
Modify Prettier Configuration
Update the Prettier configuration to include a new rule that enforces a space after function names in declarations. This will require modifying the parser to recognize function declarations and apply the spacing rule accordingly.
javascriptmodule.exports = { // other Prettier options functionDeclarationSpacing: true, }; - 2
Update Parser Logic
Adjust the parser logic to identify function declarations and insert a space after the function name. This involves modifying the Abstract Syntax Tree (AST) handling to ensure that the space is added correctly without affecting other formatting.
javascriptfunction handleFunctionDeclaration(node) { // existing logic if (node.type === 'FunctionDeclaration') { return `${node.id.name} ${formatParameters(node.params)}`; } } - 3
Add Unit Tests
Create unit tests to verify that the new spacing rule is applied correctly. This will help ensure that the rule works as intended and does not introduce any regressions in the formatting behavior.
javascripttest('adds space after function name', () => { const input = 'function myFunc() {}'; const output = 'function myFunc () {}'; expect(format(input)).toBe(output); }); - 4
Update Documentation
Revise the Prettier documentation to include information about the new spacing rule for function declarations. This will help users understand the new formatting behavior and how to configure it if needed.
- 5
Release New Version
Prepare and release a new version of Prettier that includes the updated formatting rules and documentation. Ensure that all changes are properly versioned and communicated to users.
Validation
To confirm the fix worked, run Prettier on a codebase with function declarations and check that there is a space after each function name in the output. Additionally, run the unit tests to ensure they pass without errors.
Sign in to verify this fix
Environment
Submitted by
Alex Chen
2450 rep