nova vs code pt2: snippets

Note: this is a continuation of my earlier consideration of Nova.

It seems that the recurring theme of Nova is that if a feature of Visual Studio Code or TextMate is sufficiently important, it (a) has a first class native user interface in nova and (b) it’s called something slightly different (“clips” vs “snippets”) so it wasn’t easy for me to find it. (Also that icon means nothing to me.)

As it turns out, snippet support was staring me right in the face and it’s top-notch.

I will note that the placeholders don’t seem to support transformations (so that it doesn’t seem to let me just type in “TagName” and have “tagName” and “tag-name” be created automatically as text transformations of “TagName” but, while this functionality is documented for VS Code, I’ve never actually gotten it to work.

Meanwhile, I’ve put in a feature request for this highly desirable functionality, but can confidently say that this, the most important of my two potential blockers for nova, is a non-issue and in fact another advantage of nova over visual studio code.

File Formats

While the functionality of Nova’s clips is essentially identical (or slightly superior) to those in visual studio code, the format (you can import or export them as JSON) is somewhat different. E.g. this is what the clip above looks like when exported (after I corrected the obvious typo):

{
  "content" : "import { Component as WebComponent } from 'xinjs'\n\nexport class ${0:TagName} extends WebComponent {\n\tconstructor() {\n\t\tsuper ()\n\t\t\/\/ this.initAttributes('foo')\n\t}\n}\n\nexport const ${1:tagName} = ${0:TagName}.elementCreator({\n\ttag: '${2:tag-name}'\n}) as ElementCreator<${0:TagName}>\n",
  "name" : "Xin Component Boilerplate",
  "scope" : "editor",
  "syntax" : "typescript",
  "trigger" : "xincom"
}

A similar snippet from visual studio code looks like this (I think this is basically the same format as TextMate):

{
  "scope": "typescript",
  "prefix": "xincomponent",
  "body": [
    "import { Component as WebComponent, ElementCreator, elements, vars } from 'xinjs'",
    "",
    "const {fragment, h1, slot} = elements",
    "",
    "class ${1:TagName} extends WebComponent {",
    "  content = fragment(h1(), slot())",
    "}",
    "",
    "export const ${2:tagName} = ${1:TagName}.elementCreator({tag: '${3:tag-name}'}) as ElementCreator<${1:TagName}>"
  ]
}

It’s not exactly rocket science to convert between the two formats, but Nova doesn’t seem to do it (I tried importing the file from visual studio code).