jonsmithers / Vim Html Template Literals
Licence: mit
Syntax highlighting for html template literals in javascript (as in lit-html and polymer 3)
Stars: ✭ 48
Programming Languages
javascript
184084 projects - #8 most used programming language
js
455 projects
Labels
Projects that are alternatives of or similar to Vim Html Template Literals
Imguicolortextedit
Colorizing text editor for ImGui
Stars: ✭ 772 (+1508.33%)
Mutual labels: syntax-highlighting
Vscode Smarty
Smarty syntax highlight extension for Visual Studio Code
Stars: ✭ 10 (-79.17%)
Mutual labels: syntax-highlighting
Influx Prompt
An interactive command-line InfluxDB cli with auto completion.
Stars: ✭ 42 (-12.5%)
Mutual labels: syntax-highlighting
6502 Npp Syntax
Notepad++ Syntax Highlighting for 6502 Assembly (and NESASM)
Stars: ✭ 17 (-64.58%)
Mutual labels: syntax-highlighting
Npp Robot
📝 Notepad++ syntax highligher for Robotframework automation framework
Stars: ✭ 25 (-47.92%)
Mutual labels: syntax-highlighting
Syntect
Rust library for syntax highlighting using Sublime Text syntax definitions.
Stars: ✭ 972 (+1925%)
Mutual labels: syntax-highlighting
Semshi
🌈 Semantic Highlighting for Python in Neovim
Stars: ✭ 758 (+1479.17%)
Mutual labels: syntax-highlighting
Base2tone
2 base hues - 32 variations > 1 theme
Stars: ✭ 43 (-10.42%)
Mutual labels: syntax-highlighting
Illuminate Js
Syntax Highlighter made for and in ES6. Works both on Node and Browser (React too!).
Stars: ✭ 26 (-45.83%)
Mutual labels: syntax-highlighting
Language Vue Component
Adds syntax highlighting to Vue Component files in Atom
Stars: ✭ 39 (-18.75%)
Mutual labels: syntax-highlighting
Sublimetext
Caddyfile syntax highlighting for Sublime Text 3
Stars: ✭ 17 (-64.58%)
Mutual labels: syntax-highlighting
Clygments
🎨 Code highlighting using Pygments in Clojure
Stars: ✭ 22 (-54.17%)
Mutual labels: syntax-highlighting
Asciidoc Kate
AsciiDoc/AsciiDoctor syntax highlighting plugin for Kate editor/KatePart
Stars: ✭ 5 (-89.58%)
Mutual labels: syntax-highlighting
Ft Syntax Highlight
Pure CSS syntax highlighter, no Javascript required. Includes built-in tooltips with UI themes and syntax highlighting themes
Stars: ✭ 42 (-12.5%)
Mutual labels: syntax-highlighting
Rsyntaxtextarea
A syntax highlighting, code folding text editor for Java Swing applications.
Stars: ✭ 767 (+1497.92%)
Mutual labels: syntax-highlighting
Prettify Matlab
MATLAB syntax highlighting for google-code-prettify
Stars: ✭ 10 (-79.17%)
Mutual labels: syntax-highlighting
Catage
Node package and CLI tool to convert code into an image with syntax highlighting
Stars: ✭ 44 (-8.33%)
Mutual labels: syntax-highlighting
Vue Prism
Simple Vue.js Syntax highlighting with Prism.js
Stars: ✭ 43 (-10.42%)
Mutual labels: syntax-highlighting
Downlit
Syntax Highlighting and Automatic Linking
Stars: ✭ 39 (-18.75%)
Mutual labels: syntax-highlighting
HTML Template Literals
Syntax highlighting and indentation for html inside of tagged template literals, as seen in lit-html and Polymer 3.
html`...`
Supported Syntaxes inside - HTML (including CSS embedded in
<style>
tags) - JavaScript string interpolation (
${...}
) - nested templates (
html`${html`${}`}`
)
See Configuration for support for css tagged literals (css`...`
).
Installation
This plugin requires vim-javascript (or typescript-vim if you're using typescript). If you use vim-plug for package management, installation looks like this:
Plug 'jonsmithers/vim-html-template-literals'
Plug 'pangloss/vim-javascript'
NOTE: it's generally a good idea to have let g:html_indent_style1 = "inc"
in your vimrc for reasonable indentation of <style>
tags. See :help html-indenting
.
Configuration
Flag | Description |
---|---|
g:htl_css_templates |
Enable css syntax inside css-tagged template literals (css`...` ). Indentation behavior is currently not implemented. |
g:htl_all_templates |
(Experimental) Enable html syntax inside all template literals (`...` ). |
Known Issues
- Indentation in general still has some kinks. If you see an issue, please report it.
- This plugin conflicts a bit with vim-jsx. Having both installed simultaneously may result in undesired indentation behaviors.
- A patch in vim 8.1 introduced native typescript support in Vim. However, its region definitions are less precise and it's not easy to translate vim-html-template-literals indentation behavior to work with Vim's native typescript region definitions.
Tips
-
You can configure the vim-closetag plugin to work inside html template literals:
let g:closetag_filetypes = 'html,xhtml,phtml,javascript,typescript' let g:closetag_regions = { \ 'typescript.tsx': 'jsxRegion,tsxRegion,litHtmlRegion', \ 'javascript.jsx': 'jsxRegion,litHtmlRegion', \ 'javascript': 'litHtmlRegion', \ 'typescript': 'litHtmlRegion', \ }
Note that the project description data, including the texts, logos, images, and/or trademarks,
for each open source project belongs to its rightful owner.
If you wish to add or remove any projects, please contact us at [email protected].