Vue directive color highlight
nicolidin opened this issue · 4 comments
Hello !
Does your plugin provide an improvement in the syntax of the view directives?
Indeed even having put let g: vim_vue_plugin_highlight_vue_attr = 1 in my vim configuration, the directives syntax does not change anything and always looks like string.
Is it possible to have the same directives syntax highlighting as vscode ?
The first screen below is my vim screen and the second is my vscode screen (with correct non string directive highlight syntax)
Hope you will have an answer, thank you !
Hello! Thank you for the feedback.
The directive highlight seems to work for me after I tried
let g:vim_vue_plugin_highlight_vue_attr = 1
and
let g:vim_vue_plugin_highlight_vue_attr = 0
Could you check the config like there is no space in g: vim...
Also, you maybe need to try some debug commands
:messages " ensure there are no errors
:verb hi VueValue " syntax used for Vue directive value, it should be `None` if enabled
:echo g:vim_vue_plugin_highlight_vue_attr " echo final value in .vue file
Thank you very much for your answer, I now understand where the problem comes from.
This is because of the plugin: 'posva/vim-view'.
When in my vim plugin configuration I put the plugins in this order:
1 - Plugin 'leafOfTree/vim-view-plugin'
2 - Plugin 'posva/vim-view'
I lose all the syntax highlighting that 'popsa/vim-view' provides but I gain syntax highlighting of the view directives.
Conversely, if I put my vim plugins configuration in this order:
1 - Plugin 'posva/vim-view'
2 - Plugin 'leafOfTree/vim-view-plugin'
I gain all the syntax highlighting of the plugin 'posva/vim-view' but I lose syntax highlighting of the view directives.
I have no idea how to solve this problem ...
I think it's a pretty big problem because the plugin 'popsa/vim-view' is the plugin used by the famous 'sheerun/vim-polyglot' plugin.
Do you have an idea to solve this problem ? It would help me a lot !
Thank you really much for taking time to help me !
You're welcome! I guess you want both posva/vim-vue
syntax and leafOfTree/vim-vue-plugin
directives syntax highlight.
To make it clear, both posva/vim-vue
(as well as vue
in 'sheerun/vim-polyglot') and this plugin are similar vue syntax plugin. They both combine JavaScript and other languages syntax in vue file. Normally we should choose one of them to use. For example, if you want to try this plugin, you have to comment out or disable the other one.
" Plugin 'posva/vim-vue'
let g:polyglot_disabled = ['vue']
Plugin 'sheerun/vim-polyglot'
To load vue file fastly, this plugin only load html/javascript/css
syntax by default. You can extend syntax highlight by config and other plugins. Also, custom syntax can be added in ~/.vim/syntax/html.vim
, for example.
Plugin 'pangloss/vim-javascript' " enable javascript syntax plugin
Plugin 'leafOfTree/vim-vue-plugin'
let g:vim_vue_plugin_use_sass = 1 " enable sass syntax
let g:vim_vue_plugin_highlight_vue_attr = 1 " enable directive syntax
Using html/sass/less
syntax plugin example.
Plugin 'othree/html5.vim'
" enable html/sass/less syntax plugin
let g:vim_vue_plugin_load_full_syntax = 1
Note: config should be after Plugin '...'
I am closing this issue. Feel free to reopen it if there is still any problem.