Skip to content

FAQ & Troubleshooting

Joshua Steele edited this page Jun 4, 2020 · 15 revisions

VimDevIcons - Adds Icons to Your Plugins

FAQ

Table of Contents:

It's not working at all:

Syntax or color highlighting:

Re-sourcing vimrc:

Weird artifacts after/on the glyphs:

Fonts:

Why does this exist? How did this start?


Why isn't it working? How come I don't see any icons?

  • Are you using the patched font provided in the separate repo (Nerd Fonts) or are you patching your own?

  • NOTE: if running vim and no font set it will default to the terminal font that is set

  • check what the vim/gvim font is set to, from ex mode:

    :set guifont?
  • check if the plugin is loaded (should give '1'), from ex mode:

    :echo loaded_webdevicons
  • check if the plugin is enabled (should give '1'), from ex mode:

    :echo g:webdevicons_enable
  • check if the plugin is enabled for NERDTree (should give '1'), from ex mode:

    • this should NOT need to be set under normal circumstances
    :echo g:webdevicons_enable_nerdtree
  • check if you are able to see the characters, from ex mode:

    :echo g:WebDevIconsUnicodeDecorateFileNodesDefaultSymbol
  • if all this looks correct you may try this to see if any files show flags

    • last resort, see if you can even set the default symbol and have it display anywhere (NERDTree, vim-airline's statusline, vim-airlines's tabline), from ex mode:
    :let g:WebDevIconsUnicodeDecorateFileNodesDefaultSymbol='x'

How did you get color matching based on file type in NERDtree?

  • You can either use this additional plugin: vim-nerdtree-syntax-highlight created by @tiagofumo (please note that this plugin has been known to cause slow navigation in NERDTree as documented here: https://github.com/tiagofumo/vim-nerdtree-syntax-highlight/issues/17)

  • Or you can use my current settings from: https://github.com/scrooloose/nerdtree/issues/201#issuecomment-9954740

    " NERDTrees File highlighting
    function! NERDTreeHighlightFile(extension, fg, bg, guifg, guibg)
     exec 'autocmd FileType nerdtree highlight ' . a:extension .' ctermbg='. a:bg .' ctermfg='. a:fg .' guibg='. a:guibg .' guifg='. a:guifg
     exec 'autocmd FileType nerdtree syn match ' . a:extension .' #^\s\+.*'. a:extension .'$#'
    endfunction
    
    call NERDTreeHighlightFile('jade', 'green', 'none', 'green', '#151515')
    call NERDTreeHighlightFile('ini', 'yellow', 'none', 'yellow', '#151515')
    call NERDTreeHighlightFile('md', 'blue', 'none', '#3366FF', '#151515')
    call NERDTreeHighlightFile('yml', 'yellow', 'none', 'yellow', '#151515')
    call NERDTreeHighlightFile('config', 'yellow', 'none', 'yellow', '#151515')
    call NERDTreeHighlightFile('conf', 'yellow', 'none', 'yellow', '#151515')
    call NERDTreeHighlightFile('json', 'yellow', 'none', 'yellow', '#151515')
    call NERDTreeHighlightFile('html', 'yellow', 'none', 'yellow', '#151515')
    call NERDTreeHighlightFile('styl', 'cyan', 'none', 'cyan', '#151515')
    call NERDTreeHighlightFile('css', 'cyan', 'none', 'cyan', '#151515')
    call NERDTreeHighlightFile('coffee', 'Red', 'none', 'red', '#151515')
    call NERDTreeHighlightFile('js', 'Red', 'none', '#ffa500', '#151515')
    call NERDTreeHighlightFile('php', 'Magenta', 'none', '#ff00ff', '#151515')
    call NERDTreeHighlightFile('ds_store', 'Gray', 'none', '#686868', '#151515')
    call NERDTreeHighlightFile('gitconfig', 'Gray', 'none', '#686868', '#151515')
    call NERDTreeHighlightFile('gitignore', 'Gray', 'none', '#686868', '#151515')
    call NERDTreeHighlightFile('bashrc', 'Gray', 'none', '#686868', '#151515')
    call NERDTreeHighlightFile('bashprofile', 'Gray', 'none', '#686868', '#151515')

    Note: If the colors still are not highlighting, try invoking such as:

    autocmd VimEnter * call NERDTreeHighlightFile('jade', 'green', 'none', 'green', '#151515')
    

    per: https://github.com/ryanoasis/vim-devicons/issues/49#issuecomment-101753558


How did you get color matching on just the glyph/icon in NERDtree?

  • You can add something like this to your vimrc

    " NERDTrees File highlighting only the glyph/icon
    " test highlight just the glyph (icons) in nerdtree:
    autocmd filetype nerdtree highlight haskell_icon ctermbg=none ctermfg=Red guifg=#ffa500
    autocmd filetype nerdtree highlight html_icon ctermbg=none ctermfg=Red guifg=#ffa500
    autocmd filetype nerdtree highlight go_icon ctermbg=none ctermfg=Red guifg=#ffa500
    
    autocmd filetype nerdtree syn match haskell_icon ## containedin=NERDTreeFlags
    " if you are using another syn highlight for a given line (e.g.
    " NERDTreeHighlightFile) need to give that name in the 'containedin' for this
    " other highlight to work with it
    autocmd filetype nerdtree syn match html_icon ## containedin=NERDTreeFlags,html
    autocmd filetype nerdtree syn match go_icon ## containedin=NERDTreeFlags

How do I solve issues after re-sourcing my vimrc?

  • Try adding this to the bottom of your vimrc

    if exists("g:loaded_webdevicons")
      call webdevicons#refresh()
    endif

Why do I have artifacts after (or instead) of icons?

  • Dots after icons in NERDTree (on GVim), try:
autocmd FileType nerdtree setlocal nolist

source: Issue #110

  • Newly created files in NERDTree are slow to show the glyph (icon)
    • check your current setting of :updatetime?
    • try setting updatetime in your vimrc to a lower value like 250, for more info see: Issue #153

Square brackets around icons

  • By default if your Vim supports conceal you should not see these, debug steps:

    • Check if the plugin feature is set (should be 1):
    echo g:webdevicons_conceal_nerdtree_brackets
    • Check that your vim was compiled with the conceal feature (should be +conceal):
    #### from terminal
    vim --version | grep conceal
    • Check the conceallevel (should be 3):
    set conceallevel?

Do I have to use a patched font such as Nerd Fonts?

VimDevIcons was desired to work with Nerd Fonts, however you do not have to use a patched font or even Nerd Fonts specified glyphs. You have 2 main options:

fontconfig fallback

  1. Install one of the NERD Font symbol fonts:
  1. Install 10-nerd-font-symbols.conf for Fontconfig

Use your own glyph codepoints


Rationale: Why does this exist? How did this start?

After seeing the awesome theme for Atom (seti-ui) and the awesome plugins work done for NERDTree and vim-airline and wanting something like this for Vim I decided to create my first plugin.