unnamed/slim snippets in vscode - visual-studio-code
I'm using vscode to edit latex (with the latex workshop plugin), and
I recently started creating my own snippets and really like the feature. However, I find the syntax a bit heavy for creating "small" snippets that just abbreviate frequent sequences of words. In particular, I find it cumbersome to have to give a 'name' to each snippet.
Is there a mechanism for "slim" snippets/aliases, that would e.g. take as input a file where each snippet is one line -- the first word being the abbreviation and the rest what is abbreviated?
You have a couple of options. One is to write an extension that could do this - I'll show code that works like an extension that'll work - it looks complicated but use is pretty simple.
Second, you can come close using the Hyper Snips extension where your snippet file (say latex.hsnips) could like like this:
snippet dategreeting "Gives you the current date!"
Hello from your hsnip on ``rv = new Date().toDateString()``!
endsnippet
snippet // "Fraction simple" A
\frac{$1}{$2}$0
endsnippet
snippet stte A
some text to expand
endsnippet
The descriptions in "" are not necessary and I eliminated it in the last snippet. The A flag will immediately insert your replacement text, without it you would Tab to insert the replacement text. As the examples here show you can use javascript within a snippet if you want.
The gif doesn't show it well bit here is a demo of auto-expansion with Hyper Snips:
Alternatively, download the extension macro-commander. It allows you to use vscode extension commands in a macro within your settings. This macro would go into your settings.json file:
"macros": {
"slimSnippetsInsertion" : [
{
"javascript": [
"const editor = vscode.window.activeTextEditor;",
"const document = editor.document;",
"const we = new vscode.WorkspaceEdit();",
"const cursorPosition = editor.selection.active;", // use whether an actual selection or not, returns a Position
"let keyWordRange = document.getWordRangeAtPosition(cursorPosition);", // returns a Range of start/end Positions or undefined
"if (keyWordRange === undefined) {",
"await window.showInformationMessage(`cursor must be in or immediately after word to be replaced`);",
"return;",
"}",
"let wordAtCursor = document.getText(keyWordRange);", // this is the key word to find in slimSnippets.txt
"const thisWorkspace = vscode.workspace.workspaceFolders[0].uri.toString();",
// file:///c:/Users/Mark/OneDrive/Test Bed
"const snippetFileContent = await vscode.workspace.fs.readFile(vscode.Uri.parse(`${thisWorkspace}/.vscode/slimSnippets.txt`));",
"const snippets = snippetFileContent.toString();",
// ignore leading spaces/tabs before keys
// using a named capturing group for the replacement text
"const regex = new RegExp(`\\r?(?<=\\n|^)[\\t ]*(?<key>${wordAtCursor})[\\t ]+?(?<replacementText>.*?)(?=\\r?\\n|$)`);",
"let found = snippets.match(regex);", // returns null if no matches
// matched a key but only spaces as replacement text, so do nothing and exit
"if (found && found.groups.replacementText.trimStart().length === 0) {",
"await window.showInformationMessage(`replacement text is only spaces, not replacing`);",
"return;",
"}",
"if (found) {", // found at least a matching key
"if (found.groups.replacementText) {", // found non-space replacement text
// replace `\n` and `\t` with unicode values for newline and tab
"let replace = found.groups.replacementText.replace(/\\\\n/g, '\\u000A').replace(/\\\\t/g, '\\u0009');",
"let snippet = new vscode.SnippetString(replace)",
"if (editor.selections.length === 1) editor.insertSnippet(snippet, keyWordRange);", // if zero or one selection"
// if multiple selections, uses first key and replacement text"
"else editor.insertSnippet(snippet);",
"}",
"else await window.showInformationMessage(`matching key found but with no replacement text in slimSnippets.txt`);",
"}",
"else await window.showInformationMessage(`no matching key found in slimSnippets.txt`);",
]
}
You can see where I made it to read a simpleSnippets.txt file located in the .vscode folder in the workspace - but you can change the location as long as you alter the path info in the command: vscode.workspace.fs.readFile above.
The slimSnippets.txt file is just a simple text file where the first word in each line is the key and the rest of the line is the replacement.
howdy1 $1 first $2 sentence with tabstops
howdy1 this won't be used, duplicate key above
howdy2 second sentence with variable $TM_FILENAME
key3 videos 111111 // one space necessary between key and replacement text
// it will be removed, others retained
key1 222222
stte some text to expand
mt2e more text to expand
[replacement text can have placeholders, tabstops and choices just like regular snippets]
[join multiple-lines snippets into one string with newlines as below]
[some text\nsome more text] [\t can be used for tabs]
key5 line 1\n\tline 2\n\t\tline 3
Keys are single words and if there is no replacement text (or there are only spaces in the file after a key) nothing will happen - the key will not be replaced.
The text actually inserted can be plain text or use vscode's snippet format - see the sample text file above.
The cursor must be immediately after the word or in the word and the word can be selected or not. It must be a word in the regex sense - not continuous text adjoining the word before or after it - just a standalone word, it can be anywhere on the line.
If you have duplicate keys, the first will be used. There can be empty line spaces between key/replacement lines or not.
You will not get intellisense for the keys. I may work on that.
Finally, you will need a keybinding to trigger this macro (in keybindings.json):
{
"key": "ctrl+;", // whatever keybinding you wish
"command": "macros.slimSnippetsInsertion"
},
Related
How to capitalise a letter in a custom snippet?
I am trying to create a snippet using vs code (javascript.json) to do the following code. const [click, setClick] = useState(false) I have created the following snippet which sort of works. "My Custom useState": { "prefix": "myus", "body": [ "const [${1:name}, set${1:name}] = useState(${2|true,false|})" ], "description": "My Custom useState" } But in the example, I want to try and find a way to capitalise the second word. So the above snippet output is const [click, setclick] = useState(false) Currently, I go back into the code and change to a capital letter by hand, but it has reduced the amount of code I write.
Try this as the body: "const [${1:name}, set${1/(.)/${1:/capitalize}/}] = useState(${2|true,false|})" That will "transform" the first letter (.) of that capture group 1 into a capital letter ${1:/capitalize}. In your case ${1:/upcase} would do the same thing since the capture group only contains the first letter. Normally, ${1:/upcase} will capitalize the entire capture group, not just the first letter like ${1:/capitalize} does. What will not work is set${1:name/(.)/${1:/capitalize}/} where the default :name is used. You cannot transform a default. See https://github.com/microsoft/vscode/issues/56703
Capitalize first letter of VSCode snippet
I want to create VSCode snippet to quickly use React's useState. E.g. for a state open const [open, setOpen] = useState() I'm currently using "const [ ${1}, set$1 ] = useState()" But this gives me const [open, setopen] = useState(). Note the lack of caps on open. I want to be able to just enter the state name open, and have the snippet sort out the capitalization for setOpen. I know I could use 2 variables, but I don't want to type it out twice since it'll always follow the pattern [foo, setFoo] I know I can do transforms like ${1:/upcase}, but this capitalizes the entire variable, not just the first letter.
This should work: "const [ ${1}, set${1/(.*)/${1:/capitalize}/} ] = useState()"
What ending marks should be used to extend a range to the end of the paragraph?
I am coding a word add-in and am not clear how to use the getNextTextRange(endingMarks, trimSpacing) method of the Range class. Specifically I want to select a new Range starting from the currently selected range and going to the end of the paragraph. The API for for the method states endingMarks string[] Required. The punctuation marks and/or other ending marks as an array of strings That's clear enough if you want to select up to the next comma, period or even space. But what ending marks should you use for a paragraph, a line break, or the end of the document? I have tried using '\n', '^p' and '¶' but none of these seem to work. var nr = selection.getNextTextRange(['¶'],true); nr.load("isEmpty,text"); await context.sync(); console.log('nr='+nr.text); } catch(e) { console.log("error, soz"); console.log(e); } Given a document consisting of one paragraph of text with a blank paragraph after it, and the first word of the paragraph highlighted, this add-in throws a RichApi.Error We couldn't find the item you requested. I would expect it to instead print out the remainder of the paragraph.
If I understand your scenario, you can work with the ParagraphCollection.getFirst() method. Please install the Script Lab tool. Open the sample called "Get paragraph from insertion point" for an example.
Let me expand on rick-kirkham's answer in case it helps anyone else in my situation. This is basically the same answer as given here https://stackoverflow.com/a/51160690/4114053 Ok, here is my sample word document: The rain in Spain falls. Mainly on the plain. Alice stepped through the looking glass. What did she see? And there endeth the lesson. Amen. The user selects "stepped" in the second paragraph and I want to know what the text for the rest of the paragraph, from that word, says. I also want to know what the text up to that point says. var doc = context.document; var selection = doc.getSelection(); selection.load("isEmpty,text"); await context.sync(); console.log(selection.text); //prints stepped var startRange = selection.getRange("start"); var endRange = selection.paragraphs.getLast().getRange("start"); var deltaRange = startRange.expandTo(endRange); context.load(deltaRange); await context.sync(); console.log(deltaRange.text); //prints "Alice" startRange = selection.getRange("end"); endRange = selection.paragraphs.getLast().getRange("end"); deltaRange = startRange.expandTo(endRange); context.load(deltaRange); await context.sync(); console.log(deltaRange.text); // prints "through the looking glass. What did she see?" My mistake was to get too caught up in trying to work out what "ending marks" might mean and how to use them to achieve this. (Although I still would like that spelled out in the API specification.)
What's The Best Way To Write Multi-Line Code Snippets In VS-Code?
In Sublime Text, multi-line code snippets can be defined with white-spaces in a snippet file. But as far as I know, VS-Code needs a JSON entry. These require either: Hard-breaks into a list of double-quoted strings, or Soft-break a long string using line-breaks \n This is inconvenient compared to the WYSIWYG approaches other IDEs provide out of the box. Are there better ways for defining long-blocks of code?
You can define the body of your snippet as an array of strings, each beginning on a new line. Like this: "Create for loop":{ "prefix": "mkfor", "body":[ "for(int i = 0; i < 3; i++)", "{", " //code goes here", "}" ], "description": "Creates a for loop" } or if you install Easy Snippet Maker extension, you can create your snippets by highlighting texts.
You can check out this video for a quick short tutorial https://youtu.be/g1ouTcFxQSU Go to File --> Preferences --> User Snippets. Select your preferred language. Now type the following code to make a for loop snippet: "Create for loop":{ "prefix": "for", "body":[ "for(int i = 0; i < 10; i++)", "{", " //code goes here", "}" ], "description": "Creates a for loop" } You are done. Type "for" in the editor and use the first prediction. SHORTCUT-- install Snippet-creator extension. Highlight the code that you need to make snippet. press ctrl+shift+P and type "Create snippet" on the command palette and press ENTER. select language for which you want to create snippet(eg:-CPP), then type snippet name, type snippet shortcut and then type snippet description. You are now good to go. Type the snippet shortcut in the editor that you entered in step 4, and select the prediction (if no prediction comes press ctrl+space) that comes first. Hope this helps :) Note: goto File->Preferences->User Snippets. Then select the language in which youcreated the snippet. You will find the snippet there.
I cannot find a good way to create multi-line snippets either. It's probably one of the features I'd like to see improved the most. As another answer suggested, there are a couple extensions out there to help with Snippet creation (like this and this). However, they don't escape literal dollar signs and indentation isn't great. When browsing for answers to this, I stumbled across a Pen by Denis Malinochkin (linked from this issue). However, it also did not escape dollar signs properly, so I forked it and added this line to handle literal dollar signs. Here it is: https://codepen.io/cbejensen/pen/WXLxaE Hope that helps! P.S. - This is the line I added: line = line.replace(new RegExp(/\$/, 'g'), '\\$');
I've created an extension to store snippets in a markdown file: https://marketplace.visualstudio.com/items?itemName=usernamehw.snippets-in-markdown
Hit cmd+shift+p on mac machine, and search for "Configure User Snippets" then create a file and paste below json code. provide prefix, Body, and description. Reference: https://code.visualstudio.com/docs/editor/userdefinedsnippets { "forLoop": { "prefix": "forLoop", "body": [ "for (const ${2:element} of ${1:array}) {", "\t$0", "}" ], "description": "For Loop" }, "reactClass": { "prefix": "reactClass", "body": [ "import React from 'react';", "class ${1:ComponentName} extends React.Component {", "\t$0constructor(props) {", "\t$0\t$0super(props)", "", "render() {", "return (<div> ${2:Component} </div>)", "}", "export default ${3:ComponentName}" ], "description": "For React Component class" }, "function": { "scope": "javascript,typescript", "prefix": "function", "body": [ "import React from 'react';", "import withStyles from '#material-ui/core/styles/withStyles';", "import { makeStyles } from '#material-ui/core/styles';", "", "import Styles from './style.js';", "", "const useStyles = makeStyles(Styles);", "", "function $1(props){", "const classes = useStyles();", "\treturn (", "\t\t<React.Fragment>", "\t\t\t<div className={classes.root}>", "\t\t\t\t$1", "\t\t\t</div>", "\t\t</React.Fragment>", "\t)", "}", "export default withStyles(useStyles)($1);" ], "description": "react class" } }
I use this JSON Escape formatter(?) to process a large amount of HTML into a snippet: https://www.freeformatter.com/json-escape.html (The result of this process should be added in quotes "..." into the "body" part of the JSON object.
I've written a script which you can create your own complex snippets. just using the file you'd like. so you dont' need to write the source code in a string or string array. https://github.com/banxi1988/vscode-snippets-ext-template
C# read from a Word document
I'm trying to read from a Word document and I want the computer to tell me what is written in document not to write itself in other place. So when I say the keyword "word" my program should open a dialog menu and let me to select a word file and tell me what is inside. The other keywords work. So here's my code and also my error. case "word": if (openFileDialog1.ShowDialog() == System.Windows.Forms.DialogResult.OK) { Microsoft.Office.Interop.Word.Application app = new Microsoft.Office.Interop.Word.Application(); object readFromPath = null; Document doc = app.Documents.Open(ref readFromPath); foreach (Paragraph objParagraph in doc.Paragraphs) ss.SpeakAsync(objParagraph.Range.Text.Trim()); ((_Document)doc).Close(); ((_Application)app).Quit(); } And my error is enter image description here
Application.Documents.Open takes the full path and filename. The path must end with \ and prefix the string with # (or leave out the # and double the backslashes \ as one backslash is considered to be an escape character) object readFromPath = #"C:\Users\N.Horatiu\Desktop\s.docx" Document doc = app.Documents.Open(ref readFromPath);