VS Code insert predefined characters at the end of current line - visual-studio-code

I would like to assign a keyboard shortcut which-
puts the cursor at the end of current line
and then, insert ->
I googled a lot. But not found any satisfactory solution.
Any idea ?

If your cursor doesn't start at the end of the line you will need to use a macro extension to run two commands. Using multi-command below, make this keybinding (in your keybindings.json):
{
"key": "alt+w", // whatever keybinding you like
"command": "extension.multiCommand.execute",
"args": {
"sequence": [
"cursorEnd",
{
"command": "type",
"args": { "text": "->" }
}
]
},
// "when": "editorLangId == php" // for example
}

Related

VS Code Keybinding for Line Break

I would like to add a key binding for inserting a line break in the editor (textInputFocus). Normally the Return key does this (VS Code calls the key Enter). Which command in VS Code can I use?
There is lineBreakInsert but this does not behave exactly the same as Enter normally does - it inserts a line break but keeps the cursor in the same position.
Is this what you are looking for:
{
"key": "ctrl+o",
"command": "type",
"args": {
"text": "\n"
},
"when": "textInputFocus"
}
Currently this is my workaround, but it's not a perfect solution:
I installed multi-command and added this binding (in keybindings.json):
{
"key": "ctrl+o",
"command": "extension.multiCommand.execute",
"args": {
"sequence": [
"lineBreakInsert",
"cursorDown",
"cursorHome"
]
},
"when": "textInputFocus"
}

VS Code creating custom shortcuts for common methods with line break (e.g. dd($var) or console.log($var))

First, I have a shortcut on VSCode to Wrap a text with the thing I'm typing.
<div>
Hello World
</div>
If I select "World" and use the Emmet: Wrap with Abbreviation shortcut and type span I can make this:
<div>
Hello <span>World</span>
</div>
But here's the thing :
I know we can create custom wrapping that are not the same on each side of the word we selected (source: VS Code : create custom snippet/shortcut)
{
"key": "ctrl+i",
"command": "editor.action.insertSnippet",
"args": {
"snippet": "{something}$TM_SELECTED_TEXT{/some other thing}"
},
"when": "editorTextFocus && editorHasSelection"
}
What I would like is to select my variable, then use the shortcut, and it will print what I need UNDER the selected line, and whitout breaking the current line where I come from.
For this example, I'm selecting the var $user_id, press shortcut, and then boom it will add the second line.
$user_id = User::where('user_name', $user_name)->get()->first()->id;
dd($user_id);
Here's a start:
{
"key": "ctrl+alt+c",
"command": "editor.action.insertSnippet",
"args": {
"snippet": " ==> here we need to find how to line break without spliting the code and then: <==
{console.log(}$TM_SELECTED_TEXT{)}"
},
"when": "editorTextFocus && editorHasSelection"
}
Do you think it is possible ? Maybe the solution is to use Keyboard Macro separately from VSCode ?
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?
Install Multi-command VSCode extension
Open the settings file of the extension (settings.json)
Implement your code (here's mine with console.log() and dd() )
"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"
}
},
]
},
{
"command": "multiCommand.dd",
"sequence": [
"editor.action.clipboardCopyAction",
"editor.action.insertLineAfter",
{
"command": "editor.action.insertSnippet",
"args": {
"snippet": "dd($$CLIPBOARD);"
}
},
]
}
Implement the shortcut in your VSCode settings (keybindings.json)
{
"key": "ctrl+1",
"command": "extension.multiCommand.execute",
"args": { "command": "multiCommand.console.log" }
},
{
"key": "ctrl+2",
"command": "extension.multiCommand.execute",
"args": { "command": "multiCommand.dd" }
}
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.

How do I disable inserting a new empty line when I press Enter when the cursor is in brackets?

Steps to reproduce:
simple code:
if () {}
cursor is between {}
i press Enter
result:
if () {
}
expected result:
if () {
}
I want a empty line not to be inserted.
It may be that it works by default(adds a empty line), and when Alt+Enter it doesn't add a empty line.
I did not find settings in vscode. I didn't find anything on google.
I tried this:
{
"key": "alt+enter",
"command": "type",
"args": {
"text": "\n"
},
"when": "editorTextFocus"
}
Because Alt+Enter does nothing by default.
However, the onEnterRules function used with the editor.autoIndent option detects the addition of the \n character and adds an extra empty line anyway. :(
I want to use editor.autoIndent. But I want to turn off (do not turn on) using the shortcut Alt+Enter.
Worst option: look for an extension that does exactly the same as editor.autoIndent, but has the ability to create a shortcut Alt+Enter to work the way I want.
You can use the extension multi-command and construct a command that does what you want.
Add this to your settings.json (global or workspace)
"multiCommand.commands": {
"multiCommand.lineBreakNoEmptyline": {
"sequence": [
"lineBreakInsert",
"deleteWordRight",
"cursorRight",
"cursorHome"
]
}
}
Add this to your keybindings.json:
{
"key": "alt+enter",
"command": "multiCommand.lineBreakNoEmptyline",
"when": "editorTextFocus"
}
Or using the keybinding only method
{
"key": "alt+enter",
"command": "extension.multiCommand.execute",
"args": {
"sequence": [
"lineBreakInsert",
"deleteWordRight",
"cursorRight",
"cursorHome"
]
},
"when": "editorTextFocus"
}
I'll show the info from my comment here so that it is clearer. This keybinding:
{
"key": "alt+enter", // whatever keybinding you want
"command": "extension.multiCommand.execute",
"args": {
"sequence": [
// "lineBreakInsert",
{
"command": "type",
"args": {
"text": "\n"
}
},
"editor.action.clipboardCutAction"
]
},
}
The type command acts differently than a lineBreakInsert command so it is a little easier to then delete that extra line as the cursor is already there. It is just a small improvement, 2 less commands.
Demo:

How to replace a variable in a snippet in Visual Studio Code?

I use javascript snippet with keybinding.
I have this code below:
{
"key": "alt+c",
"command": "editor.action.insertSnippet",
"when": "editorTextFocus",
"args": {
"snippet": " const $TM_CURRENT_WORD = $1"
}
},
If I type box and than press alt+c, I get...
box const box =
But I expected
const box =
How can I achieve that?
Snippets will always insert text wherever the cursor is at the time the snippet is triggered - that is why you are seeing the behaviour you get. If the word was first selected, an insertion would replace that word like normal.
The easiest way is just to select the box text and then alt+c and you will get your result. But with the extra step of selecting.
Here is a macro solution as well.
Using a macro extension like multi-command put this into your settings.json:
"multiCommand.commands": [
{
"command": "multiCommand.insertConst", // whatever name you want to give it
"sequence": [
"cursorWordLeftSelect",
{
"command": "editor.action.insertSnippet",
"args": {
"snippet": "const $TM_SELECTED_TEXT = $1"
}
}
]
}
]
and some keybinding:
{
"key": "alt+c",
"command": "extension.multiCommand.execute",
"args": { "command": "multiCommand.insertConst" }, // use same name here
"when": "editorTextFocus"
},
or you could just modify your snippet so that you don't first type the variable name. You would trigger the snippet, then type the variable name, tab and then its value like so:
{
"key": "alt+c",
"command": "editor.action.insertSnippet",
"when": "editorTextFocus",
"args": {
"snippet": " const $1 = $2"
}
},

Visual Studio Code keybindings - Running two or more commands with one shortcut

I have the following keybinding in VS Code which toggles the position of the cursor between the active document and built-in terminal:
// Toggle between terminal and editor focus
{
"key": "oem_8",
"command": "workbench.action.terminal.focus"
},
{
"key": "oem_8",
"command": "workbench.action.focusActiveEditorGroup",
"when": "terminalFocus"
}
Before i click the shortcut key to move the cursor to the terminal, i first have to save the active file.
I would therefore like to run the file saving command, which after searching on google i believe is workbench.action.files.save
How would i do this? I have tried adding the above code snippet at the end of the "command" line but it has not worked.
You would need a macro extension to run multiple commands from one keybinding.
I now use multi-command and there are other macro extensions now.
You can use this keybinding (in your keybindings.json) with the multi-command extension - no need for anything in settings.json:
{
"key": "oem_8", // or whatever keybinding you wish
"command": "extension.multiCommand.execute",
"args": {
"sequence": [
"workbench.action.files.save",
"workbench.action.terminal.focus"
]
},
"when": "editorTextFocus" // if you want this, you probably do
}
If you have more complicated macros you can still build them in your settings.json if you wish.
There is a way to run a sequence of commands without any extensions. It is by using Tasks. I like this method, because it allows to define a command, that is in workspace scope, not in global scope. The idea was taken from this blog post.
Example of tasks.json:
{
"version": "2.0.0",
"tasks": [
{
"label": "cmd-1",
"command": "${command:workbench.action.files.save}"
},
{
"label": "cmd-2",
"command": "${command:workbench.action.terminal.focus}"
},
{
"label": "cmd-All",
"dependsOrder": "sequence",
"dependsOn": [
"cmd-1",
"cmd-2"
],
}
]
}
Then in keybindings.json you just bind your hotkey to the task:
{
"key": "oem_8",
"command": "workbench.action.tasks.runTask",
"args": "cmd-All"
}
Note, that when defining a task, you can pass arguments to the command with the help of input variables.
Another extension to run multiple commands: Commands
{
"key": "oem_8",
"command": "commands.run",
"args": [
"workbench.action.files.save",
"workbench.action.terminal.focus"
],
"when": "editorTextFocus"
}
I made this extension. It's great.