https://github.com/cristianoliveira/vim-react-html-snippets
Vim plugin for html related snippets inside react components.
https://github.com/cristianoliveira/vim-react-html-snippets
Last synced: about 2 months ago
JSON representation
Vim plugin for html related snippets inside react components.
- Host: GitHub
- URL: https://github.com/cristianoliveira/vim-react-html-snippets
- Owner: cristianoliveira
- License: mit
- Created: 2017-07-23T07:03:44.000Z (over 8 years ago)
- Default Branch: master
- Last Pushed: 2017-07-23T09:32:59.000Z (over 8 years ago)
- Last Synced: 2025-01-17T18:00:42.828Z (10 months ago)
- Size: 3.91 KB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Vim React Html Snippets
A Vim snippet library for html when creating React components.
This plugin only provides the html(jsx) snippets it works well as a complement
of others snippets like:
https://github.com/epilande/vim-react-snippets
Requires [UltiSnips](https://github.com/SirVer/ultisnips).
## Installation
Using [vim-plug](https://github.com/junegunn/vim-plug):
```vim
" React code snippets
Plug 'cristianoliveira/vim-react-html-snippets'
" Ultisnips
Plug 'SirVer/ultisnips'
" Trigger configuration (Optional)
" let g:UltiSnipsExpandTrigger=""
```
## Usage
As any other - you use specific codes for autocompletion. For this library
it is basic the html tag name.
#### Skeleton
- `<> "- Place a custom tag and cursors"`
- `div "- Place a plain div"`
- `divc "- Place a div using className"`
- `div# "- Place a div with ID & className"`
- `div. "- Place a div with className"`
- `a "- Place a link and cursor for href"`
- `img "- Place a img and cursor for src"`
- `li "- Place a list"`
- `ol "- Place a ol"`
- `dl "- Place a dl"`
- `p "- Place a paragraph"`
- `select "- Place a Select Box"`
- `strong "- Place a "`
- `table "- Place a HTML "`
- `span "- Place a "`
- `span# "- Place a with ID & className"`
- `span. "- Place a with className"`
### Properties
- `cn "- Place a className"`