Skip to content
| Marketplace
Sign in
Visual Studio Code>Other>Emmet-Style File CreateNew to Visual Studio Code? Get it now.
Emmet-Style File Create

Emmet-Style File Create

crunchi

|
575 installs
| (0) | Free
Make multiple files, parent and child files & directories in an emmet-style syntax
Installation
Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter.
Copied to clipboard
More Info

Emmet File

A powerful way to setup project scaffolds.

Using Familiar Emmet syntax.

Features

Emmet File is a extension to scaffold different file & folder structure with Emmet-style syntax.

From creating multiple files at once.

To a whole project scaffolding

How to use?

Call the Track Files in the Command Pallete (Ctrl+Shift+P).

Grammar

+ Sibling Files


Create multiple sibling files using +, try index.html+styles.css!

! Directory


Create Directories with !, as dirname!file.

^ Repitition, $ Number


Same as Emmet, but replace * with ^, you can have as many $ as you want.

{} Contents


Add inner contents of the file via {}, $s are supported

@ Range


For more control of the ^ command, You can specify its range with ^[stop]@[start],[step]

\ Escape


For typing special characters, use the \ to escape the syntax.

\ Escape


For typing special characters, use the \ to escape the syntax.

[] Templates


Special preprocessing and templating functionality is in the []. You may add special shortcuts to long emmet file abbreviations.

Template Settings

To add new templates, edit the Emmet File > Templates settings (emmetFile.templates) in the settings.json file.

Exceptions

Please make an active file to parse your directory!

You need to open at least 1 file in the editor for the extension to register and save your workspace path.

Invalid Parsing!

Self Explantory, but note that {} will not throw a Invalid Parsing error even if parsing is invalid.

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