Format
Documentation for the /format command to format code in various languages
/format
Command
The /format
command allows you to format and beautify code in various programming languages. It helps improve code readability by standardizing indentation, spacing, and syntax formatting.
Available Subcommands
/format code
Formats code in a specific programming language.
Usage
Options
Option | Description | Required | Platform |
---|---|---|---|
language | Programming language of the code | Yes | Discord (parameter), Slack (flag with —language) |
code | Code to format | Yes | Discord (parameter), Slack (flag with —code) |
Supported Languages
The /format
command supports the following programming languages:
- JSON: Indents and structures JSON data
- JavaScript: Formats JavaScript code
- TypeScript: Formats TypeScript code
- JSX: Formats JSX (React) code
- HTML: Formats HTML markup
- XML: Formats XML markup
- CSS: Formats CSS stylesheets
- SCSS: Formats SCSS (Sass) stylesheets
- SQL: Formats SQL queries with keyword capitalization
- Go: Formats Go code
- PHP: Formats PHP code
Platform-Specific Implementation
Discord Implementation
- Uses Discord’s named parameter system (e.g.,
language:
,code:
) - Responses appear as embedded messages with syntax highlighting
- The formatted code is displayed in a code block with proper language syntax highlighting
- Discord users select the language from a dropdown of supported options
Slack Implementation
- Supports two input formats:
- Flag-based approach with quotes:
/format --language <language> --code "<code>"
(legacy approach) - Flag-based approach with backticks (recommended):
/format --language javascript --code
function() `
- Flag-based approach with quotes:
- The backtick approach is the recommended and preferred method for all Slack commands
- No need to escape special characters when using backticks, making it much cleaner
- Particularly useful for JSON and other complex code where escaping would be problematic
- Responses are shown with formatted blocks displaying the result
- The formatted code is presented in a code block with language-specific syntax highlighting
- Includes a list of supported languages in the help message when no parameters are provided
Examples by Language
JSON
Before:
Command:
After:
JavaScript
Before:
Command:
After:
TypeScript
Before:
Command:
After:
JSX
Before:
Command:
After:
HTML
Before:
Command:
After:
XML
Before:
Command:
After:
CSS
Before:
Command:
After:
SQL
Before:
Command:
After:
Go
Before:
Command:
After:
PHP
Before:
Command:
After:
SCSS
Before:
Command:
After:
How It Works
The formatter applies language-specific formatting rules:
- JSON: Properly indents and structures JSON with standardized spacing
- JavaScript/TypeScript: Formats braces, indentation, and spacing
- JSX: Formats React JSX code with proper component and attribute spacing
- HTML/XML: Properly indents tags and attributes
- CSS/SCSS: Formats selectors, properties, and values with consistent spacing
- SQL: Capitalizes SQL keywords and formats spacing
- Go: Applies basic Go formatting standards
- PHP: Formats according to PHP style guidelines
Implementation Details
The code formatting is powered by Prettier, a popular code formatter known for its consistency and flexibility. For language-specific formatting:
- JavaScript/TypeScript/JSX: Uses Prettier with the Babel parser
- HTML/XML: Uses Prettier’s HTML parser
- CSS/SCSS: Uses Prettier with PostCSS and SCSS syntax support
When using the /format
command, the code is processed by the appropriate Prettier plugin based on the language specified, ensuring optimal formatting according to each language’s conventions.
Limitations
- Maximum code size is limited due to Discord and Slack message constraints
- For very complex or large code, only a portion may be returned
- Language-specific formatters may have varying capabilities
- Syntax errors in the input code may result in formatting failures
Use Cases
- Improve code readability before sharing with others
- Clean up minified or poorly formatted code
- Standardize code formatting in discussions
- Make code examples more presentable in team conversations
- Learn proper code formatting standards for different languages
Notes
- The formatted code will be displayed in a syntax-highlighted code block
- Formatting very large code snippets may be truncated due to message limitations
- For Slack, we strongly recommend using backticks for all code:
- Recommended approach: Use backticks for clean syntax without escaping:
/format --language javascript --code
function() ` - Alternative approach: Use double quotes with escaped special characters:
/format --language javascript --code "function() {}"
- Recommended approach: Use backticks for clean syntax without escaping: