Toollix Code Beautifier

Fast, privacy-friendly code formatting for JavaScript, TypeScript, JSX, TSX, MJS, and CJS directly in Visual Studio Code.

Toollix Code Beautifier keeps formatting simple and private. Formatting runs locally on your computer using the bundled formatter: your source code is never uploaded, no Toollix account is required, and an internet connection is not required for formatting.

Supported languages

Language	File extensions
JavaScript	`.js`
TypeScript	`.ts`
JavaScript React	`.jsx`
TypeScript React	`.tsx`
ECMAScript modules	`.mjs`
CommonJS modules	`.cjs`

Features

Beautify an entire document or only the selected code.
Format from the editor context menu or Command Palette.
Integrate with Format Document With... and VS Code's default formatter setting.
Support format on save.
Configure indentation, tabs or spaces, quotes, semicolons, trailing commas, print width, bracket spacing, arrow-function parentheses, and line endings.
Store settings globally, per workspace, or per project.
Format locally without uploading source code.

Installation

From the Visual Studio Marketplace, search for Toollix Code Beautifier and select Install.

To install a downloaded VSIX:

Open the Extensions view in VS Code.
Select the ... menu.
Choose Install from VSIX....
Select the Toollix .vsix file and reload VS Code when prompted.

Usage

Open a supported file and use any of these methods:

Open the Command Palette and run Toollix: Beautify Document.
Select code, open the Command Palette, and run Toollix: Beautify Selection.
Right-click in the editor and choose Beautify Document or Beautify Selection.
Run Format Document With... and select Toollix Code Beautifier.

Default formatter and format on save

Add the following to your VS Code settings.json:

{
  "[javascript]": {
    "editor.defaultFormatter": "toollix.toollix-code-beautifier"
  },
  "[javascriptreact]": {
    "editor.defaultFormatter": "toollix.toollix-code-beautifier"
  },
  "[typescript]": {
    "editor.defaultFormatter": "toollix.toollix-code-beautifier"
  },
  "[typescriptreact]": {
    "editor.defaultFormatter": "toollix.toollix-code-beautifier"
  },
  "editor.formatOnSave": true
}

VS Code identifies .mjs and .cjs files as JavaScript, so they use the [javascript] formatter configuration.

Settings

Setting	Type	Default	Description
`toollixBeautifier.tabWidth`	number	`2`	Number of spaces used for each indentation level.
`toollixBeautifier.useTabs`	boolean	`false`	Indent with tabs instead of spaces.
`toollixBeautifier.semi`	boolean	`true`	Print semicolons where appropriate.
`toollixBeautifier.singleQuote`	boolean	`false`	Prefer single quotes where possible.
`toollixBeautifier.trailingComma`	string	`"all"`	Use `all`, `es5`, or `none` trailing commas.
`toollixBeautifier.printWidth`	number	`80`	Preferred maximum line length before wrapping.
`toollixBeautifier.bracketSpacing`	boolean	`true`	Print spaces inside object-literal brackets.
`toollixBeautifier.arrowParens`	string	`"always"`	Use `always` or `avoid` for sole arrow parameters.
`toollixBeautifier.endOfLine`	string	`"lf"`	Use `lf`, `crlf`, `cr`, or `auto` line endings.

All Toollix settings have resource scope, so they can be configured for an individual workspace or project.

Configuration example

{
  "toollixBeautifier.tabWidth": 2,
  "toollixBeautifier.useTabs": false,
  "toollixBeautifier.semi": true,
  "toollixBeautifier.singleQuote": false,
  "toollixBeautifier.trailingComma": "all",
  "toollixBeautifier.printWidth": 80,
  "toollixBeautifier.bracketSpacing": true,
  "toollixBeautifier.arrowParens": "always",
  "toollixBeautifier.endOfLine": "lf"
}

Privacy

Formatting happens locally inside VS Code.
Source code is not uploaded or sent to Toollix.
No Toollix account is required.
An internet connection is not required for formatting.

Troubleshooting

If Toollix is not used when you format a file:

Run Format Document With... from the Command Palette.
Select Configure Default Formatter....
Choose Toollix Code Beautifier.

If a command is unavailable, confirm that the active editor uses a supported language mode. You can check or change the language mode from the status bar. Workspace-specific Toollix settings can override your global settings.

Website

Visit toollix.app for more Toollix tools.

License

Licensed under the MIT License. See the included LICENSE file for details.