https://github.com/Abdelaziz18003/vscode-quasar-snippets

vscode snippets for quasar-framework
https://github.com/Abdelaziz18003/vscode-quasar-snippets

quasar-framework snippets vscode

Last synced: about 1 month ago
JSON representation

vscode snippets for quasar-framework

• Host: GitHub
• URL: https://github.com/Abdelaziz18003/vscode-quasar-snippets
• Owner: Abdelaziz18003
• License: mit
• Created: 2018-10-17T13:12:19.000Z (about 6 years ago)
• Default Branch: master
• Last Pushed: 2022-11-30T10:54:53.000Z (about 2 years ago)
• Last Synced: 2024-08-02T00:25:26.302Z (4 months ago)
• Topics: quasar-framework, snippets, vscode
• Homepage: https://marketplace.visualstudio.com/items?itemName=abdelaziz18003.quasar-snippets
• Size: 1.97 MB
• Stars: 41
• Watchers: 5
• Forks: 10
• Open Issues: 1
• Metadata Files:
  • Readme: README.md
  • Changelog: CHANGELOG.md
  • License: LICENSE

Awesome Lists containing this project

• quasar-awesome - github - snippets) | Quasar components' snippets for VSCode that can increase your productivity working on Quasar projects. | v0.17.x | (Awesome Quasar [](https://github.com/sindresorhus/awesome) / Tutorials)

README

        
# vscode-quasar-snippets

Quasar framework is an awesome project isn't it? But, do you find it tedious to remember the basic syntax for all the components it provides. So, this simple plugin is here to help you solving this problem.

## Features

This plugin provides snippets with the basic usage syntax for the most used components of quasar-framework (All components soon).

All you need to do is typing the component's name **all in lowercase** and press tab. (all components will follow this logic).

``` html

qlayout + [tab] => 

```

![quasar-snippets-demo](https://user-images.githubusercontent.com/11301627/65047552-8e591e80-d95a-11e9-9ee2-c9ba915e0ff4.gif)

For components properties, I tried to provide just the essential ones that are needed in most cases. The ones that are not used frequently can be looked up in the documentation. But if you find me missing some important property that is used frequently with a given component, don't hesitate to let me know.

## Contribution Guide

This plugin is still in development. Please don't get upset if you don't find a given component and feel free to contribute instead. Your contributions of all sorts are welcome. Here are some guidelines to consider when submitting a contribution.

- If you find a bug or you have a suggestion, feel free to open an issue for it.

- If you want to add a new snippet or fix an existing bug, please open an issue for that (if it is not already open) and indicate that you are working on it to avoid working on the same issue by other developers.

- Make sure to keep snippets organized according to the official documentation of quasar.

- Snippet prefix must be the lowercase version of the component's name ex: QProgress => qprogress.

- Snippet body must include only the most used properties. Component doc "Basic Usage" section is enough in *most* cases.

- Snippet description can be the doc description of the component if it is small or just a meaningful part of it if it is long.

- ***Important***: Pug snippets are auto-generated using `vsc-snippets-html2pug` module (run `npm install` to install it). After adding a new HTML snippet just run `npm run pug` to update the Pug snippets file.

Again, your contributions of all sorts are welcome :heart:

**Enjoy!**