如何选择代码片段/实时模板创建方式？及如何实现动态变量获取？

Awesome questions—let’s break this down clearly for you:

1. Code Snippets/Live Templates vs. Copy-Paste: Which to Choose? #

• Opt for snippets/templates for repetitive, reusable code: If you’re typing the same pattern over and over (like your console.log example, function boilerplate, or component skeletons), snippets/templates are a no-brainer. They keep your code consistent, save time, and let you inject dynamic values without retyping the whole thing.
• Stick to copy-paste for one-off or unique code: If it’s a piece of code you’ll never reuse, or something so customized it doesn’t fit a reusable pattern, copying and pasting is faster than setting up a snippet.

A quick rule of thumb: If you’ve typed the same code 3+ times, it’s worth turning into a snippet/template.

2. Dynamic Snippets/Templates for Recent Variables or Clipboard Content #

Hardcoded snippets are easy, but dynamic ones require leaning into your editor’s built-in features or custom scripting. Here’s how to pull off what you want in the two most popular editor ecosystems:

For VS Code #

VS Code’s user snippets support built-in variables, and you can use extensions for more advanced logic:

a. Insert Clipboard Content

Use the ${CLIPBOARD} variable to drop whatever’s currently in your clipboard directly into the snippet. Example for logging clipboard content:

"Log clipboard content": {
  "prefix": "logclip",
  "body": [
    "console.log(\"Clipboard: \", ${CLIPBOARD});"
  ],
  "description": "Log content from clipboard"
}

b. Auto-Insert Recent Variables

• Semi-automated (quick and easy): Use placeholder variables to speed up selecting your target variable. For your console.log example, create this snippet:

  "Log variable with label": {
    "prefix": "log",
    "body": [
      "console.log(\"${1:amount}: \", ${1:amount});"
    ],
    "description": "Log a variable with its name as a label"
  }
  

  When you type log + Tab, you’ll be prompted to replace amount—start typing your variable’s name, and VS Code’s autocomplete will pick it up instantly.

• Full automation: For true "grab the most recent variable" behavior, use an extension designed for dynamic snippets. These tools let you run small scripts to scan your current file and inject the last declared variable into the snippet.

For JetBrains IDEs (WebStorm, IntelliJ, etc.) #

JetBrains’ Live Templates are super powerful for dynamic content, thanks to built-in functions and Groovy scripting:

a. Insert Clipboard Content

Use the clipboard() function directly in your template. Here’s how to set it up:

1. Go to Settings > Editor > Live Templates
2. Create a new template under the JavaScript group
3. Prefix: logclip
4. Template text: console.log("Clipboard: ", $CLIPBOARD$);
5. Click Edit Variables, then set CLIPBOARD to use the expression clipboard()

b. Auto-Insert the Most Recent Variable

You can use a Groovy script to scan the lines above your cursor and grab the last declared variable. Here’s the step-by-step:

1. Go to Settings > Editor > Live Templates and create a new template in the JavaScript group
2. Prefix: log
3. Template text: console.log("$VAR$: ", $VAR$);
4. Click Edit Variables next to the template text
5. For the VAR variable, paste this Groovy expression in the "Expression" field:

   def editor = com.intellij.openapi.editor.EditorFactory.instance.currentEditor
   def document = editor.document
   def caretModel = editor.caretModel
   def currentLine = document.getLineNumber(caretModel.offset)
   for (int i = currentLine - 1; i >= 0; i--) {
       def lineText = document.getText(com.intellij.openapi.util.TextRange.create(document.getLineStartOffset(i), document.getLineEndOffset(i)))
       def matcher = lineText =~ /(const|let|var)\s+(\w+)\s*=/
       if (matcher.find()) {
           return matcher.group(2)
       }
   }
   return "variable"
   

6. Check the "Skip if defined" box so it auto-fills without prompting

Now, when you type log + Tab right after declaring const amount = 1000, it’ll automatically spit out console.log("amount: ", amount);

Quick Recap #

Dynamic snippets/templates work by tapping into your editor’s ability to access context (like clipboard content or recent code) via built-in variables or custom scripts. For most cases, semi-automated placeholders are more than enough, but full automation is totally possible with extensions or IDE-specific scripting.

内容的提问来源于stack exchange，提问作者GameAtrix1