Visual Studio Code
Microsoft's popular code editor with extensive extension support and built-in Git integration. Integrate with Ultracite for seamless formatting and linting.
Configuration
Ultracite automatically creates and manages the settings file for Visual Studio Code.
These settings enable format on save, auto-fix linting issues, and configure TypeScript for consistent type checking across your project.
.vscode/settings.json
{ "editor.defaultFormatter": "esbenp.prettier-vscode", "typescript.tsdk": "node_modules/typescript/lib", "editor.formatOnSave": true, "editor.formatOnPaste": true, "emmet.showExpandedAbbreviation": "never", "[javascript]": { "editor.defaultFormatter": "biomejs.biome" }, "[typescript]": { "editor.defaultFormatter": "biomejs.biome" }, "[javascriptreact]": { "editor.defaultFormatter": "biomejs.biome" }, "[typescriptreact]": { "editor.defaultFormatter": "biomejs.biome" }, "[json]": { "editor.defaultFormatter": "biomejs.biome" }, "[jsonc]": { "editor.defaultFormatter": "biomejs.biome" }, "[html]": { "editor.defaultFormatter": "biomejs.biome" }, "[vue]": { "editor.defaultFormatter": "biomejs.biome" }, "[svelte]": { "editor.defaultFormatter": "biomejs.biome" }, "[css]": { "editor.defaultFormatter": "biomejs.biome" }, "[yaml]": { "editor.defaultFormatter": "biomejs.biome" }, "[graphql]": { "editor.defaultFormatter": "biomejs.biome" }, "[markdown]": { "editor.defaultFormatter": "biomejs.biome" }, "[mdx]": { "editor.defaultFormatter": "biomejs.biome" }, "editor.codeActionsOnSave": { "source.fixAll.biome": "explicit", "source.organizeImports.biome": "explicit" }}What Ultracite configures for Visual Studio Code
Ultracite sets up Visual Studio Code with optimal settings for your chosen linter.
Format on save
Automatically formats your code when you save, keeping it clean and consistent.
Default formatter
Sets up the correct formatter extension for each file type based on your linter choice.
Auto-fix on save
Enables code actions on save to automatically fix linting issues and organize imports.
TypeScript SDK
Configures the workspace TypeScript version for consistent type checking.
Extension installation
Automatically installs the required linter extension when creating a new configuration.
Format on paste
Formats pasted code to match your project's style automatically.
Trusted by top companies
And used by thousands of open source projects.
What the community is saying
Here's what some of the most innovative and forward-thinking developers in the React ecosystem have to say about Ultracite.
