Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/samuelsimoes/vim-jsx-utils
Plugin with some utilities (like extract partial render, rename tag, select self close tags) to folks who work with JSX on Vim.
https://github.com/samuelsimoes/vim-jsx-utils
closing-tags jsx productivity vim vim-jsx-utils vim-plugin
Last synced: about 2 months ago
JSON representation
Plugin with some utilities (like extract partial render, rename tag, select self close tags) to folks who work with JSX on Vim.
- Host: GitHub
- URL: https://github.com/samuelsimoes/vim-jsx-utils
- Owner: samuelsimoes
- License: mit
- Created: 2016-04-09T21:55:16.000Z (over 8 years ago)
- Default Branch: master
- Last Pushed: 2017-03-22T18:09:41.000Z (almost 8 years ago)
- Last Synced: 2024-04-16T00:52:29.096Z (8 months ago)
- Topics: closing-tags, jsx, productivity, vim, vim-jsx-utils, vim-plugin
- Language: Vim script
- Homepage:
- Size: 150 KB
- Stars: 73
- Watchers: 6
- Forks: 1
- Open Issues: 3
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# vim-jsx-utils
Plugin with some utilities to folks who work with **[JSX](https://facebook.github.io/jsx/)** on Vim.:warning: This plugin only expose a [set of functions](#functions). You need create your own mappings to this, like:
```
nnoremap ja :call JSXEncloseReturn()
nnoremap ji :call JSXEachAttributeInLine()
nnoremap je :call JSXExtractPartialPrompt()
nnoremap jc :call JSXChangeTagPrompt()
nnoremap vat :call JSXSelectTag()
```:warning: All functions must be invoked on the first component line.
## Installation
You can install this plugin with [Pathogen](https://github.com/tpope/vim-pathogen), [Vundle](https://github.com/VundleVim/Vundle.vim) and other plugin loaders.## Functions
### JSXSelectTag
Select the whole tag, like `vat`, but with a little improvement to select self-closing tags.### JSXEncloseReturn
Put the current tag on a return statement with parenthesis.![](examples/enclose-vim.gif)
### JSXEachAttributeInLine
Put each tag attribute's on its own line to better readability.![](examples/eachline-vim.gif)
### JSXExtractPartialPrompt
:warning: Only ES6 classesExtract some tag on its own method on a ES6 class.
![](examples/partial-vim.gif)
### JSXChangeTagPrompt
Change the tag name
![](examples/change-vim.gif)
-------
Samuel Simões ~ [@samuelsimoes](https://twitter.com/samuelsimoes) ~ [Blog](http://blog.samuelsimoes.com/)