How to simultaneously create a new folder and multiple files in VSCode? - visual-studio-code

Question

I discovered recently in Visual Studio Code that I can create a new folder and a new file simultaneously by using the following patten: Test/Test.jsx
eg.
1: Right click and select 'New File'.
2: Enter desired folder and file name.
3: The result from step 1 & 2.
Anyone know if it's possible to create a folder with multiple files using a similar pattern? This is what I'd like to be able to do.

Answer 1

I don't think you can do it the way you showed, but it is pretty easy to do it with a task. In your tasks.json:
{
"version": "2.0.0",
"tasks": [
{
"label": "new react folder and files",
"command": "mkdir ${input:dirName} && touch '${input:dirName}/${input:dirName}.component.jsx' '${input:dirName}/${input:dirName}.styles.jsx'",
"type": "shell",
"problemMatcher": [],
"presentation": {
"echo": false,
"reveal": "silent",
"focus": false,
"panel": "shared",
"showReuseMessage": false,
"clear": true
},
}
],
// ........................................................................................
"inputs": [
{
"type": "promptString",
"id": "dirName",
"description": "Complete my folder name",
"default": "jsx folder to create"
}
]
}
And some keybinding to trigger the task (in your keybindings.json):
[
{
"key": "alt+j",
"command": "workbench.action.tasks.runTask",
"args": "new react folder and files",
}
]
This will prompt for the directory name and then create the folder and two files within it.
[I used bash commands mkdir and touch to create the folder and files, if you are using a shell without those commands swap out the ones you have.]