Format Vue without leaving your browser
Format Vue single-file components containing template, script, and style sections.
How to use this formatter
- Paste your Vue or upload a file in the input panel.
- Choose indentation and print width, then select Format. Auto-format is also available.
- Review the output with line numbers and expandable code sections. Copy or download the result.
Keep template markup and component logic readable together. Check framework-specific rules and type errors in your Vue project.
What to check
The formatter parses component source but does not mount Vue components or run your build.
Syntax checks help find parsing errors. They do not replace application tests, a compiler, or a security review.
Vue example to try
The editor starts with a sample like this when there is no matching saved draft. Use Sample in the workspace to reset it.
<template><main><h1>{{ title }}</h1></main></template><script setup>const title="Hello, Tidyzo";</script><style>main{padding:24px}</style>Common questions
Is Tidyzo free?
Yes. The formatter is free to use without creating an account.
Where does my code go?
Pasted and uploaded documents are processed in your browser. Optional remembered drafts and history stay in browser storage. Importing a URL contacts that URL directly. Share links contain the document in the URL fragment, so anyone with the link can read it. See the privacy information.
Can I use this without JavaScript?
You can read the guides and examples without JavaScript. The interactive editor and local formatting engine require JavaScript.
How large can my document be?
The workspace accepts documents up to 5 MB. Complex documents can take longer, and operations that exceed the time limit are stopped to keep the workspace responsive.