How to paste part of a multi-line snippet to a specific line and the rest to another line

Question

I want to create a custom snippet for my own usage, I currently want to make a snippet for @emotion/core.

I always want /** @jsx jsx */ to be ontop of my jsx file. So when I import my module on line 9, then import {css, jsx} from '@emotion/core is on line 9 and /** @jsx jsx */ is on line 0. How do I achieve this?

Current Snippet:

"Import emotion":{
    "prefix":"ime",
    "description": "Import emotion",
    "body": 
    [
        "/** @jsx jsx */",
        "import {css, jsx} from '@emotion/core';"
    ]
},

Mark · Accepted Answer · 2020-05-22 22:30:49Z

You are going to have to break the snippet up into separate commands to move the cursor in a middle step. Which will require a macro extension like multi-command.

Put this into your settings.json:

"multiCommand.commands": [

  {
    "command": "multiCommand.insertImports",
    "sequence": [
      {
        "command": "editor.action.insertSnippet",
        "args": {
          "snippet": "import {css, jsx} from '@emotion/core';"
        }
      },
      // "editor.action.setSelectionAnchor",   // see note below
      "cursorTop",
      {
        "command": "editor.action.insertSnippet",
        "args": {
          "snippet": "/** @jsx jsx */\n"
        }
      },
      // "editor.action.goToSelectionAnchor",
      // "editor.action.cancelSelectionAnchor",
      "cursorDown"  
    ]
  }
]

and some keybinding to trigger that macro:

{
  "key": "ctrl+shift+i",             // whatever keybinding you wish
  "command": "extension.multiCommand.execute",
  "args": {
    "command": "multiCommand.insertImports"
  },
   "when": "editorTextFocus"
},

Note on anchor commands

editor.action.setSelectionAnchor
editor.action.goToSelectionAnchor
editor.action.cancelSelectionAnchor

these commands are in the Insiders' Build and so presumably in the v1.46 release in early June 2020. They are in the macro only to facilitate returning the cursor to where you began. For some reason, the command workbench.action.navigateToLastEditLocation isn't working for me here - I thought it would be sufficient.

Without these new commands the cursor doesn't return to where you began - maybe that isn't a problem for you. In any case, they are coming soon. Once you have the version they are included in just un-comment those commands. Here is a demo using those commands:

Collectives™ on Stack Overflow

How to paste part of a multi-line snippet to a specific line and the rest to another line

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related