Skip to content
| Marketplace
Sign in
Visual Studio Code>Programming Languages>ViewModel Highlighting & FormatterNew to Visual Studio Code? Get it now.
ViewModel Highlighting & Formatter

ViewModel Highlighting & Formatter

mihai-slobozeanu

|
9 installs
| (0) | Free
Syntax highlighting and VSCode-style formatting for .viewmodel (dotjs/express-dot-engine) template files with JavaScript and [[...]] blocks.
Installation
Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter.
Copied to clipboard
More Info

ViewModel Highlighting & Formatter

ViewModel Highlighting & Formatter is a VSCode extension that provides syntax highlighting and smart formatting for .viewmodel files that include embedded JavaScript and custom [[ ... ]] templating.


✨ Features

  • Syntax highlighting for .viewmodel templates
  • JavaScript-aware formatting using VSCode’s built-in formatter
  • Preserves original structure: semicolons, blank lines, var declarations, etc.
  • Supports [[ ... ]] and [[= ... ]] templating placeholders
  • Only formats the content of selected blocks: header, body, declarations

🧩 Example Template

[[##body:
    createProperties: function () {
        const self = this;
        self.superclass.createProperties.apply(self, arguments);
    },

    selectItems: function(){
        const itemRoute = [[= JSON.stringify(getRoute()) ]];
    }
#]]

⚙️ Configuration

Uses your workspace or global VSCode settings:

  • editor.tabSize
  • editor.insertSpaces

Optional custom setting:

"viewmodelFormatter.printWidth": 120

🛠️ Installation

From VSIX

  1. Run: vsce package
  2. Install: code --install-extension viewmodel-highlighting-extension-1.0.0.vsix

From Marketplace (after publishing)

Coming soon…


📄 License

MIT


💡 Feedback / Issues

Please open issues or feature requests on GitHub.

  • Contact us
  • Jobs
  • Privacy
  • Manage cookies
  • Terms of use
  • Trademarks
© 2025 Microsoft