DEV Community

Cover image for A awesome cli-tool for cooking VSCode snippets.
RssXio
RssXio

Posted on • Edited on

A awesome cli-tool for cooking VSCode snippets.

csnp now is release 1.4.0!

Introduction

csnp is a node script written by typescript

Based on VS Code built-in customizable code snippets(official documentation introduction)

Give developers the ability to create VS Code snippets quickly and easily

Usage Scene

In your code file, use the command -log and press enter to generate the code console.log('-> log', _)_ is the position of the cursor

In the .code-snippet file of VS Code

  • command -log represents a prefix

  • codes console.log('-> log', _) represents a body

The csnp command can generate the log.csnp file quickly, which can be managed by markdown friendly syntax and generated under the root path of the project

exp: .vscode/.csnp/js/log.csnp

The js of the path in csnp is stand for csnp type

Easy Start

# 1. install global $ npm i -g csnp # 2. init csnp file $ csnp # 3. open csnp file,edit your own code snippets # 4. generate code snipepts $ csnp push 
Enter fullscreen mode Exit fullscreen mode

.csnp File

--- name: Log prefix: '-log' description: "log sth" --- console.log('-> log', $1) 
Enter fullscreen mode Exit fullscreen mode

The log.csnp will converts the js.code-snippets file by executing the 'csnp push' command, then you can use the '-log' command.

.code-snippets File

The js.code-snippets file is a piece of json, and VS Code will automatically parses the file with this suffix file.

{ "Log": { "prefix": "-log", "body": [ "console.log($1)" ], "description": "log sth" } } 
Enter fullscreen mode Exit fullscreen mode

End

If you think csnp helpful, thanks for your star ⭐️ ~

Github Link

Top comments (0)