What is the simpliest way to create custom shortcuts for methods I'm using everydays?
Like dd() Log::info() or console.log().
Let me explain exactly what behavior I want for my shortcut:
My shortcuts breaks, maybe because of an update, here's the new method to fix my shortcuts, but consider doing the old method explained bellow in the same post before.
Here's mine:
{
"multiCommand.commands": [
// (ctrl+2) Only prints methode, usefull if you want to write something
{
"command": "multiCommand.console.log.1",
"sequence": [
"editor.action.insertLineAfter",
{
"command": "editor.action.insertSnippet",
"args": {
"snippet": "console.log(\"-> $0\")"
}
},
]
},
{
"command": "multiCommand.log.info.1",
"sequence": [
"editor.action.insertLineAfter",
{
"command": "editor.action.insertSnippet",
"args": {
"snippet": "Log::info(\"-> $0\");"
}
},
]
},
// (ctrl+3) Select your variable before activating the shortcut, it will place the selection in the right spot automatically
{
"command": "multiCommand.console.log.2",
"sequence": [
"editor.action.clipboardCopyAction",
"editor.action.insertLineAfter",
{
"command": "editor.action.insertSnippet",
"args": {
"snippet": "console.log(\"$CLIPBOARD$0 : \", $CLIPBOARD$0)\n"
}
},
]
},
{
"command": "multiCommand.log.info.2",
"sequence": [
"editor.action.clipboardCopyAction",
"editor.action.insertLineAfter",
{
"command": "editor.action.insertSnippet",
"args": {
"snippet": "Log::info(\"$CLIPBOARD$0 : \" . $$CLIPBOARD$0);"
}
},
]
},
// (ctrl+4) PHP Log::info(array)
{
"command": "multiCommand.log.info.3",
"sequence": [
"editor.action.clipboardCopyAction",
"editor.action.insertLineAfter",
{
"command": "editor.action.insertSnippet",
"args": {
"snippet": "Log::info(\"$CLIPBOARD$0 : \" . json_encode($$CLIPBOARD$0));"
}
},
]
},
// (cltr+5) classic dd() with variable in php
{
"command": "multiCommand.dd.2",
"sequence": [
"editor.action.clipboardCopyAction",
"editor.action.insertLineAfter",
{
"command": "editor.action.insertSnippet",
"args": {
"snippet": "dd($$CLIPBOARD$0);"
}
},
]
},
],
"makefile.configureOnOpen": false
}
Open (windows) C:\Users\YourUsername\AppData\Roaming\Code\User\keybindings.json and add your shortcuts keybinding with the targetting command name.
Notice that I'm using the option when, this enables you to have the same shortcut key but binding with a different command depending on the file extension (if you do PHP or JS or ...).
Here's mine:
[
{
"key": "ctrl+2",
"command": "multiCommand.console.log.1",
"when": "editorLangId == javascript || editorLangId == vue"
},
{
"key": "ctrl+2",
"command": "multiCommand.log.info.1",
"when": "editorLangId == php"
},
{
"key": "ctrl+3",
"command": "multiCommand.console.log.2",
"when": "editorLangId == javascript || editorLangId == vue"
},
{
"key": "ctrl+3",
"command": "multiCommand.log.info.2",
"when": "editorLangId == php"
},
{
"key": "ctrl+4",
"command": "multiCommand.console.log.3",
"when": "editorLangId == javascript || editorLangId == vue"
},
{
"key": "ctrl+4",
"command": "multiCommand.log.info.3",
"when": "editorLangId == php"
},
{
"key": "ctrl+5",
"command": "multiCommand.dd.2",
"when": "editorLangId == php"
},
So now everytime I press ctrl + 2 I insert a Log::info() for PHP files or console.log() for Javascript and Vue. This really helps you to reduce the number of shortcut you have to remember!
PS: I think the old file I have C:\Users\YourUsername\AppData\Roaming\Code\User\settings.json is not used anymore.
I came up with this solution, thanks to @Mark in comments, related to this thread : How can I insert a snippet on a new line with vscode?
Edit in settings.json
console.log()) "multiCommand.commands": [
{
"command": "multiCommand.console.log",
"sequence": [
"editor.action.clipboardCopyAction",
"editor.action.insertLineAfter",
{
"command": "editor.action.insertSnippet",
"args": {
"snippet": "console.log(\"$CLIPBOARD: \", $$CLIPBOARD)\n$0"
}
},
]
},
Then in VSCode go to Preferences -> Keyboard Shortcuts, open keybindings.json
Add the path binding command
// (new version 2024)
{
"key": "ctrl+1",
"command": "multiCommand.console.log"
}
// (old version)
{
"key": "ctrl+1",
"command": "extension.multiCommand.execute",
"args": { "command": "multiCommand.console.log" }
}
If I'm understanding your question correctly, you can probably just use $0 to show where your cursor will end and use \n to insert a line break.
However, I'm not entirely sure if this works when creating a snippet from the Keyboard Shortcut file, but it works from the snippet file so I'm assuming it'll work here.
In order to ease file manipulation here is the file location path on Linux
settings.json and keybindings.json are in /home/Username/.config/Code/User
I've used "ctrl+alt+p" for print()
and "ctrl+alt+l" for LOG.debug() with LOG declared as LOG = logging.getLogger(__name__) as described here
settings.json content
{
"workbench.colorTheme": "Visual Studio Light",
"git.enableSmartCommit": true,
"git.autofetch": true,
"git.confirmSync": false,
"diffEditor.ignoreTrimWhitespace": true,
"files.trimTrailingWhitespace": true,
"editor.minimap.enabled": false,
"[html]": {
"editor.defaultFormatter": "vscode.html-language-features"
},
"terminal.integrated.defaultProfile.osx": "bash",
"terminal.integrated.profiles.osx": {
"bash": {
"path": "bash",
"args": ["--login"]
}
},
"git.openRepositoryInParentFolders": "never",
"javascript.updateImportsOnFileMove.enabled": "always",
"workbench.tree.enableStickyScroll": false,
"editor.stickyScroll.scrollWithEditor": false,
"editor.stickyScroll.enabled": false,
"diffEditor.hideUnchangedRegions.enabled": true,
"multiCommand.commands": [
{
"command": "multiCommand.printVariable",
"sequence": [
"editor.action.clipboardCopyAction",
"editor.action.insertLineAfter",
{
"command": "type",
"args": {
"text": "print(f'"
}
},
"editor.action.clipboardPasteAction",
{
"command": "type",
"args": {
"text": ": {"
}
},
"editor.action.clipboardPasteAction",
{
"command": "type",
"args": {
"text": "}')"
}
},
]
},
{
"command": "multiCommand.logVariable",
"sequence": [
"editor.action.clipboardCopyAction",
"editor.action.insertLineAfter",
{
"command": "type",
"args": {
"text": "LOG.debug(f'"
}
},
"editor.action.clipboardPasteAction",
{
"command": "type",
"args": {
"text": ": {"
}
},
"editor.action.clipboardPasteAction",
{
"command": "type",
"args": {
"text": "}')"
}
},
]
}
]
}
keybindings.json content
// Place your key bindings in this file to override the defaults
[
{
"key": "ctrl+alt+p",
"command": "multiCommand.printVariable",
},
{
"key": "ctrl+alt+l",
"command": "multiCommand.logVariable",
}
]
