Skip to content

roguib/ng-vs-snippets

Repository files navigation

ng-vs-snippets

.github/workflows/build.yml ts License: MIT made-for-VSCode PRs Welcome

Automatic VS Code snippet file generation for Angular codebases. Seamlessly maintain up-to-date VS Code snippets of all of your code.

Currently, we support snippet generation from the following Angular elements:

Element Status
Component ✅ Supported
Directive 👷 Not yet supported
Pipe 👷 Not yet supported

Installation

Install ng-vs-snippets as a dev-dependency in your Angular project. To do so, run:

npm i @roguib/ng-vs-snippets --save-dev

Create a package.json script to extract snippets from your codebase:

"scripts": {
    "ng-vs-snippets": "ng-vs-snippets --dir . --output ./.vscode",
},

Execute the script by running:

npm run ng-vs-snippets

The script will generate a out.code-snippets file containing all the definitions. Make sure you don't have any file with the same name since the data contained in that file is going to be replaced.

Troubleshooting

Sometimes, due to VS Code configuration issues, snippets don't appear in the suggestion's dropdown. Make sure to specify, in VS Code settings.json configuration file the following properties:

"editor.tabCompletion": "on",
"editor.snippetSuggestions": "top"

If this doesn't fix the problem, open the command palette and search for Preferences: Configure User Snippets to ensure the editor is considering the fille where your generated snippets are defined.

Benchmarking

This project uses benchmark.js and Continuous Benchmark workflow to run benchmarking tests. You may check out the results in the following GitHub page.

Documentation

You can find the full document design at this url.

Contributing

Pull requests are welcome :) Make sure to create an issue first so anyone's work is overlaped.

About

Automatic VS Code snippet file generation for Angular codebases

Resources

License

Stars

Watchers

Forks

Packages

No packages published