HiPhish
commented
3 weeks ago Can you please elaborate? I don't understand what exactly the problem is.
Open hungvx-dev opened 4 weeks ago
HiPhish
commented
3 weeks ago Can you please elaborate? I don't understand what exactly the problem is.
hungvx-dev
commented
2 weeks ago @HiPhish The current query for Vue only includes rainbow-delimiters (which highlights tags in the template tag). -> You can add a new query to apply rainbow colors only to parentheses in the tag (without affecting the template tag).
HiPhish
commented
2 weeks ago If I understand you correctly what you want is to highlight delimiters inside the script tag only, but not inside template tag. Is that right?
hungvx-dev
commented
2 weeks ago If I understand you correctly what you want is to highlight delimiters inside the
scripttag only, but not insidetemplatetag. Is that right?
Yes, exactly. Please help me implement this feature.
HiPhish
commented
2 weeks ago I don't think I want to include this sort of thing with the plugin, but you can add it to your personal configuration. In your Neovim configuration (e.g. ~/.config/nvim on Unix) create the file after/queries/vue/rainbow-script.scm (the name rainbow-script is arbitrary, you can call it whatever you want) with the following contents:
(script_element
(start_tag
"<" @delimiter
(tag_name) @delimiter
">" @delimiter)
(end_tag
"</" @delimiter
(tag_name) @delimiter
">" @delimiter @sentinel)) @containerThis is a subset of the default query. Next in your rainbow delimiters configuration you need to tell the plugin to use your own custom query.
vim.g.rainbow_delimiters = {
query = {
vue = 'rainbow-script'
},
}Or if you prefer Vim script
let g:rainbow_delimiters = {
\ 'query': {
\ 'vue': 'rainbow-script'
\ },
\ }Note that your CSS will still be highlighted because it is not part of the Vue language. You will have to blacklist CSS if you don't want to highlight it. For more information see :h g:rainbow_delimiters, :h rb-delimiters-query and :h rb-delimiters-custom-query.
If more people want this type of query I can make it official, but until then you can add it to your configuration.
hungvx-dev
commented
2 weeks ago Thank you for the recommendation. I applied that configuration, and it works well for me.
Evidence of the result:
HiPhish
commented
2 weeks ago Actually, now that I think about it you could leave the query completely empty. As it is right now the script tag is still getting highlighted, but maybe you don't want that.
hungvx-dev
commented
2 weeks ago Thanks for the help, I am happy with it now.
I'm requesting the addition of rainbow-parens support specifically for script blocks in Vue files within the rainbow-delimiters.nvim plugin. Currently, while there are good highlights for other languages, Vue files do not have consistent parentheses highlighting for script tags, which can lead to readability issues when working with complex JavaScript code.