Self Closing Tag Syntax and Quoteless attributes?
Nobody has claimed this yet.
- Dominant language
- Vim Script
- Stars
- 6.5k
- Forks
- 414
- PR merge metrics
- No merged PRs in 30d
Description
First off - major thanks for this plugin. It's SUPER legit! And it's working like a dream.
I've been looking into using Emmet with React/JSX.
I was wondering what the process would be like for adding a couple convenience features?
1. The first would be a shortcut syntax for custom self-closing tags.
The official Emmet support for this is to create a tag, and then join it, ex:
Convert ProfileButton to <ProfileButton></ProfileButton> with <C-y>,
and then join it via <C-y>j to create <ProfileButton/>.
Would it be possible to also have the option of converting: ProfileButton/ to <ProfileButton/> with the default emmet leader key?
2. The second would be the ability to have custom attributes without quotes, for example:
This Nav component has a custom attribute that fires off a function:
<Nav onUserInput={ this.closeNav } />
Right now, all custom attributes are surrounded by double quotes. Would it be possible to add the option to have quoteless custom attributes? An example syntax could be using backticks to denote that exact output is desired.
I tried to make sense of what's going on in the parsing so that I could try to submit a PR... but sheesh - my vimscript-fu is seriously lacking.
If you could point me in the right direction, maybe I'd be able to hammer it out?
Contributor guide
No contributing guide indexed for this repository
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start by reading the parsing logic in autoload/emmet/lang/html.vim around line 247, as linked in the issue, and trace how JSX-style tags and attributes are handled. Done means supporting the requested ProfileButton/ self-closing syntax and an option for exact, quoteless attribute output, including the examples given.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript, vim
- Domain
- frontend, tooling
- Issue type
- Feature
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100