Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/cipchk/vscode-snippet-generator

Generate a snippet extensions for vscode.
https://github.com/cipchk/vscode-snippet-generator

vscode vscode-extension vscode-snippet-generator vscode-snippets

Last synced: 3 months ago
JSON representation

Generate a snippet extensions for vscode.

Host: GitHub
URL: https://github.com/cipchk/vscode-snippet-generator
Owner: cipchk
License: mit
Created: 2018-12-08T16:23:40.000Z (about 6 years ago)
Default Branch: master
Last Pushed: 2020-12-21T11:59:25.000Z (about 4 years ago)
Last Synced: 2024-04-14T05:10:32.758Z (10 months ago)
Topics: vscode, vscode-extension, vscode-snippet-generator, vscode-snippets
Language: TypeScript
Size: 40 KB
Stars: 18
Watchers: 2
Forks: 7
Open Issues: 0
Metadata Files:
- Readme: README.md
- License: LICENSE

Awesome Lists containing this project

README

## vscode-snippet-generator

![CI](https://github.com/cipchk/vscode-snippet-generator/workflows/CI/badge.svg)
[![Dependency Status](https://david-dm.org/cipchk/vscode-snippet-generator/status.svg?style=flat-square)](https://david-dm.org/cipchk/vscode-snippet-generator)
[![NPM version](https://img.shields.io/npm/v/vscode-snippet-generator.svg?style=flat-square)](https://www.npmjs.com/package/vscode-snippet-generator)

Generate a snippet extensions for vscode.

## Usage VSCode extension

1. Install [Dynamic Custom Snippets](https://marketplace.visualstudio.com/items?itemName=cipchk.vscode-snippet-generator) extension.
2. Add snippet files into `.vscode/snippets/` folder. (Please refer to the template content [Snippet tempalte](#Snippet-tempalte))
3. The first time create the `.vscode/snippets/` folder, need to restart vscode; otherwise you only need to trigger the `vscode-snippet-generator: Cache all dynamic snippets` command again.

Happy coding!!!

> You can configure `"vscode-snippet-generator.prefix": ""` in `settings.json` to change the prefix.
>
> You can configuae `"vscode-snippet-generator.languages": ["html", "typescript"]` in `settings.json` to support language list.

## Usage Command Line: Quick start

```sh
$ git clone --depth 1 https://github.com/cipchk/vscode-snippet-generator-tpl.git
$ cd vscode-snippet-generator-tpl
$ # build
$ npm run build
$ # package vscode extension
$ npm run release
```

## Cli Options

```sh
vscode-snippet-generator --help
```

## Snippet tempalte

Markdown file symbol of a specify snippet, like this:

```markdown
---
prefix: button
description: 按钮
scope: typescript,html
---

```html

$0
```
```

- `prefix` defines how this snippet is selected from IntelliSense and tab completion. In this case `button`.
- `description` is the description used in the IntelliSense drop down.
- `scope` Restrict template scope, if not specified, it means no restriction. In this case `typescript` and `html` document.
- markdown body is defines snippet code, muse be hava a code tag.

> How to writing snippet code, pls refre to [vscode-Creating your own snippets](https://code.visualstudio.com/docs/editor/userdefinedsnippets)

## I18n

The `description` support i18n, like this:

```markdown
---
prefix: button
description:
zh-CN: 按钮
en-US: Button
---
```

Specify language version to generate with `i18n` parameter.

```bash
vscode-snippet-generator --i18n=zh-CN --outFile=snippets-zh-CN.json
vscode-snippet-generator --i18n=en-US --outFile=snippets-en-US.json
```

If you want to display multiple languages in a snippet extension, you can use `i18nTpl`.

```bash
# window
vscode-snippet-generator --i18nTpl=\"{zh-CN}({en-US})\"
```

## License

The MIT License (see the [LICENSE](https://github.com/cipchk/vscode-snippet-generator/blob/master/LICENSE) file for the full text)