index.html 14.6 KB
Newer Older
Pallav Agarwal's avatar
Pallav Agarwal committed
1
<title>Plugin Management in VIM - VARSTACK</title>
2 3 4 5 6 7 8
<div id="fb-root"></div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.5";
fjs.parentNode.insertBefore(js, fjs);
9 10 11 12
}(document, 'script', 'facebook-jssdk'));
var host = "varstack.com";
var hostwww = "www.varstack.com";
if (((host == window.location.host) || (hostwww == window.location.host))
13
        && (window.location.protocol != 'https:'
Pallav Agarwal's avatar
Pallav Agarwal committed
14
            || window.location.toString().match(/http.?:\/\/var/))){
15
  window.location = window.location.toString().replace(/^http:/, "https:").replace(/https:\/\/varstack/, "https://www.varstack");
16 17
}
</script>
Pallav Agarwal's avatar
Pallav Agarwal committed
18
<meta name=viewport content="width=device-width, initial-scale=1">
Pallav Agarwal's avatar
Pallav Agarwal committed
19 20
<meta charset="utf-8"/>

Pallav Agarwal's avatar
Pallav Agarwal committed
21
<noscript>
Pallav Agarwal's avatar
Pallav Agarwal committed
22
    <link href="/css/bootstrap.min.css" rel="stylesheet">
Pallav Agarwal's avatar
Pallav Agarwal committed
23 24 25
    <link href="/css/highlighting.css" rel="stylesheet">
    <link href="/css/style.css" rel="stylesheet">
    
26
    
Pallav Agarwal's avatar
Pallav Agarwal committed
27
</noscript>
28

Pallav Agarwal's avatar
Pallav Agarwal committed
29
<script id="loadcss">function loadCSS(e,n,o,t){"use strict";var d=window.document.createElement("link"),i=n||window.document.getElementsByTagName("script")[0],r=window.document.styleSheets;return d.rel="stylesheet",d.href=e,d.media="only x",t&&(d.onload=t),i.parentNode.insertBefore(d,i),d.onloadcssdefined=function(e){for(var n,o=0;o<r.length;o++)r[o].href&&r[o].href===d.href&&(n=!0);n?e():setTimeout(function(){d.onloadcssdefined(e)})},d.onloadcssdefined(function(){d.media=o||"all"}),d}
Pallav Agarwal's avatar
Pallav Agarwal committed
30
loadCSS( "https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css", document.getElementById("loadcss"));
Pallav Agarwal's avatar
Pallav Agarwal committed
31 32 33
loadCSS( "/css/highlighting.css", document.getElementById("loadcss"));
loadCSS( "/css/style.css", document.getElementById("loadcss"));
    
34
    
Pallav Agarwal's avatar
Pallav Agarwal committed
35
</script>
Pallav Agarwal's avatar
Pallav Agarwal committed
36 37 38

<!-- HTML5 shim, for IE6-8 support of HTML5 elements -->
<!--[if lt IE 9]>
Pallav Agarwal's avatar
Pallav Agarwal committed
39
    <script src="//html5shim.googlecode.com/svn/trunk/html5.js"></script>
Pallav Agarwal's avatar
Pallav Agarwal committed
40 41 42 43 44 45 46
    <![endif]-->

    
    <img src="/img/vim-plug.png" id="bg-img" alt="Screenshot of vim-plug plugin manager in action">
    
    <div class="container">
        <div class="row" id="menu">
47 48 49 50
            <div class="col-sm-2 col-xs-2 menu" id="site_title">
                <a href="/" style="color:black;">
                    <img src="/img/logo.png" style="max-height:90%;">
                </a>
Pallav Agarwal's avatar
Pallav Agarwal committed
51
            </div>
52
            <div class="col-sm-6 col-xs-10 menu">
Pallav Agarwal's avatar
Pallav Agarwal committed
53 54 55
                <div class="row" id="top_menu">
                    <ul class="nav nav-pills">
                        <li class="active" id="blog"><a class="color_change" href="/">Blog</a></li>
56 57 58
                        <li class="" id="tips"><a class="color_change" href="/tips/">Tips</a></li>
                        <li class="" id="algo"><a class="color_change" href="/algo/">Behind The Scenes</a></li>
                        <li class="" id="about"><a class="color_change" href="/about_me/">About Me</a></li>
Pallav Agarwal's avatar
Pallav Agarwal committed
59
                    </ul>
Pallav Agarwal's avatar
Pallav Agarwal committed
60 61
                </div>
            </div>
62 63 64 65 66
            <div class="col-sm-4 col-xs-12 menu">
                <form action="/search/" id='search-form'>
                    <input id="search-box" type="text" name="query" placeholder="Search..">
                </form>
            </div>
Pallav Agarwal's avatar
Pallav Agarwal committed
67 68 69 70 71
        </div>
        
        <div class="row" id="image"> </div>
        
        <div class="row" id="content">
Pallav Agarwal's avatar
Pallav Agarwal committed
72
            <div class="col-md-7 col-md-push-3">
Pallav Agarwal's avatar
Pallav Agarwal committed
73
                <div class="row" id="data">
Pallav Agarwal's avatar
Pallav Agarwal committed
74 75 76 77 78 79 80
                    <div class="col-md-12">
                        <br />
                        <h3>Plugin Management in VIM</h3>
                        <hr />
                        <div class="row text-justify" id="content-holder">
                            <div class="col-md-12">
                                <p><em>What I've written in this post is my opinion, and should
Pallav Agarwal's avatar
Pallav Agarwal committed
81 82 83 84
not be taken as fact. There may be features I don't know
about, and my preference order may not be same as yours.</em></p>

<p>Here is a quick overview of the plugin managers that I've used,
85
ending with explanations on how to use my personal favorite,
Pallav Agarwal's avatar
Pallav Agarwal committed
86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 178 179 180 181 182 183 184 185 186 187 188 189 190 191 192 193 194 195 196 197 198 199 200 201 202 203 204 205 206 207 208 209 210 211 212 213 214 215 216 217 218 219 220 221
Vim-Plug. You may skip the comparision section if you just want
to be started quickly.</p>

<p><br /></p>

<h3>3. PATHOGEN</h3>

<p>No discussion of package managers is complete without mentioning
pathogen. Pathogen is one of the oldest Package Manager for vim.
It simply allows you to clone every plugin into a separate directory
inside a bundle folder.
This way, all plugins can retain their git directories, and can be
updated with proper git commands. All Pathogen does, is ensure that
all plugins get loaded at runtime when vim is started.</p>

<p><strong>JUDGEMENT</strong>: Too low level. You cannot disable and enable plugins as
easily as other package managers, your plugins aren't shown in vimrc.</p>

<p><br /></p>

<h3>2. VUNDLE</h3>

<p>Vundle is the plugin manager I've used the longest. All plugins
can be listed in your vimrc, and you don't have to clone each one
manually. A simple <code>:PluginInstall</code> takes care of the plugins'
installations. Commenting out a single line from vimrc keeps
that plugin from loading up. Updating plugins and upgrading VUNDLE
is just as easy as the install command.</p>

<p><strong>JUDGEMENT</strong>: Vundle has some difficult to remember boilerplate
code, and the plugin install is single threaded. On my system,
that takes a significantly more time (around 5x) than the multi
threaded Vim-Plug.</p>

<p><br /></p>

<h3>1. VIM-PLUG</h3>

<p>Vim-Plug is a fork of Vundle, and thus has all its features.
Apart from that, if your vim is compiled with python or ruby
support, or you are using Neovim, Vim-Plug uses multi-threading
to clone your plugins in parallel. Vim-Plug also supports lazy
loading of plugins, which means that plugins may be set to load
only on specific commands, making your vim loadup much faster.</p>

<p><strong>JUDGEMENT</strong>: I shifted to Vim-Plug a few weeks ago, and haven't
looked back since. I haven't encountered any problems and till now
it seems like the perfect plugin manager to me.</p>

<p><br />
<br /></p>

<h2>Using Vim-Plug Plugin Manager</h2>

<p><br /></p>

<p>The good thing about Vim-Plug is that there's no boilerplate code
to make it work.</p>

<p>First, let us install Vim-Plug (This only needs to be done once).
Download <a href="https://raw.githubusercontent.com/junegunn/vim-plug/master/plug.vim">this</a>
file and place it <code>~/.vim/autoload</code></p>

<p>Alternatively, you can use the following command to do it for you.
Paste the following inside a terminal.</p>

<pre><code>curl -fLo ~/.vim/autoload/plug.vim --create-dirs \
    https://raw.githubusercontent.com/junegunn/vim-plug/master/plug.vim
</code></pre>

<p>At the top of vimrc, start the plugin manager with
the command <code>call plug#begin()</code>.</p>

<p>This starts the area within which all your plugins will be listed.
A plugin is listed in the following format:</p>

<pre><code class="vimscript">Plug '&lt;plugin name&gt;'  "If the plugin is on vim-scripts.org
Plug '&lt;username&gt;/&lt;pluginname&gt;'  "If the plugin is on github.com
</code></pre>

<p>If the plugin is on vim-scripts.org, there would be a mirrored github
version which you can find via Google. For example, in case of</p>

<p><code>https://github.com/vim-scripts/Wombat</code> the corresponding code
will be</p>

<pre><code class="vimscript">Plug 'Wombat' "OR
Plug 'vim-scripts/Wombat'
</code></pre>

<p>while in the case of</p>

<p><code>https://github.com/nanotech/jellybeans.vim</code> the corresponding code
will be</p>

<pre><code class="vimscript">Plug 'nanotech/jellybeans.vim'
</code></pre>

<p><strong>Note: Text following <code>"</code> inside vimrc represents a comment.</strong></p>

<p><br /></p>

<p>In case you want to lazy load a plugin,
<a href="https://github.com/junegunn/vim-plug#on-demand-loading-of-plugins">this</a>
would be a good place to learn how.</p>

<p>Once you have listed all your plugins, end the call with
<code>call plug#end()</code>.</p>

<p><br /></p>

<p>Putting all this together, we get:</p>

<pre><code>call plug#begin()
Plug 'Wombat'
Plug 'nanotech/jellybeans.vim'
Plug 'scrooloose/nerdtree' , {'on': 'NERDTreeToggle'}  "Lazy Loading Example
call plug#end()
</code></pre>

<p>Put this in your .vimrc and you are good to go.</p>

<p><br /></p>

<p><strong>PRO-TIP:</strong> If you are like me, and do not want to do the installation step
every time you have to use your vimrc on a new system, you can put the
following on the top of your vimrc. It basically checks if Vim-Plug is
installed, and downloads the file in the proper place if it isn't.</p>

<pre><code>if empty(glob('~/.vim/autoload/plug.vim'))
    silent !curl -fLo ~/.vim/autoload/plug.vim --create-dirs \
        https://raw.githubusercontent.com/junegunn/vim-plug/master/plug.vim
    autocmd VimEnter * PlugInstall
endif
</code></pre>

Pallav Agarwal's avatar
Pallav Agarwal committed
222 223
                            </div>
                        </div>
Pallav Agarwal's avatar
Pallav Agarwal committed
224 225 226
                    </div>
                </div>
                <hr /><br />
Pallav Agarwal's avatar
Pallav Agarwal committed
227 228 229 230 231
            </div>
            <div class="col-md-3 col-md-pull-7" id="recent">
                <h4>RECENT POSTS</h4>
                <ul class="nav nav-pills nav-stacked">
                    
232 233 234 235
                    <li>
                        <a href="/2017/05/07/How-I-got-here/" class="color_change">An intern's views - How I...</a>
                    </li>
                    
236 237 238 239
                    <li>
                        <a href="/2016/09/26/YourHonour-k8s-programming-judge/" class="color_change">YourHonour: A k8s based distributed programming...</a>
                    </li>
                    
240
                    <li>
241
                        <a href="/2016/06/09/Bugzilla-Landfills/" class="color_change">Learning from mistakes: Bugzilla Landfills</a>
242 243
                    </li>
                    
244
                    <li>
245
                        <a href="/2016/05/13/SAT-Solver/" class="color_change">Determining legal USE Flag combinations using...</a>
246 247
                    </li>
                    
248
                    <li>
249
                        <a href="/2016/05/06/SSH-port-forwarding-and-some-cool-uses/" class="color_change">SSH port forwarding and some cool...</a>
250 251
                    </li>
                    
Pallav Agarwal's avatar
Pallav Agarwal committed
252 253 254 255
                </ul>
                <h4>RECENT TIPS</h4>
                <ul class="nav nav-pills nav-stacked">
                    
256 257 258 259
                    <li>
                        <a href="/2016/05/06/Ultimate-control-over-mobile-browser/" class="color_change">Ultimate control over Mobile Browser with...</a>
                    </li>
                    
260 261 262 263
                    <li>
                        <a href="/2016/04/27/SSH-keys/" class="color_change">Easy sharing of SSH keys</a>
                    </li>
                    
264 265 266 267
                    <li>
                        <a href="/2015/08/01/SSH-from-Windows/" class="color_change">Using SSH from Windows 10 without...</a>
                    </li>
                    
Pallav Agarwal's avatar
Pallav Agarwal committed
268 269 270 271
                    <li>
                        <a href="/2015/07/27/Boost-Python-Performance/" class="color_change">Cython: Boost Python Code Performance</a>
                    </li>
                    
Pallav Agarwal's avatar
Pallav Agarwal committed
272
                    <li>
273 274 275 276 277 278 279 280 281
                        <a href="/2015/07/01/Vim-Mappings/" class="color_change">Quick intro to custom Vim Mappings...</a>
                    </li>
                    
                </ul>
                <h4>TAGGED POSTS</h4>
                <ul class="nav nav-pills nav-stacked">
                    
                    <li>
                        <a href="/2016/05/13/Reference-Sheets-and-Useful-Links/" class="color_change">Reference Sheets and Useful Links</a>
Pallav Agarwal's avatar
Pallav Agarwal committed
282 283 284 285 286 287 288 289 290
                    </li>
                    
                </ul>
                <br />
                <br />
            </div>
            <div class="col-md-2">
            </div>
            <div class="row">
291
                <div class="col-md-7 col-md-offset-3 col-xs-10 col-xs-offset-1">
292 293
                    <div class="row">
                            <div class="col-xs-4">
Pallav Agarwal's avatar
Pallav Agarwal committed
294
                                <div class="fb-like" data-href="//www.varstack.com" data-layout="standard" data-action="like" data-show-faces="true" data-share="true"></div>
295 296 297 298 299 300 301
                            </div>
                            <div class="col-xs-8 text-right">
                                <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
                                <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
                                <script src="/js/script.js"></script>
                                
                                
302
                                
303 304 305 306 307 308 309
                            </div>
                    </div>
                    <br/>
                </div>
                <div class="col-md-7 col-md-offset-3 col-xs-10 col-xs-offset-1">
                    <div id="disqus_thread"></div>
                    <script type="text/javascript" async>
Pallav Agarwal's avatar
Pallav Agarwal committed
310 311 312 313 314 315 316 317 318 319 320 321 322 323 324 325
/* * * CONFIGURATION VARIABLES * * */
var disqus_shortname = 'varstack';

/* * * DON'T EDIT BELOW THIS LINE * * */
(function() {
    var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
    dsq.src = '//' + disqus_shortname + '.disqus.com/embed.js';
    (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
})();
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
    (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
    m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');

ga('create', 'UA-21768487-2', 'auto');
ga('send', 'pageview');
326 327
                    </script>
                    <noscript>Please enable JavaScript to view the <a href="https://disqus.com/?ref_noscript" rel="nofollow">comments powered by Disqus.</a></noscript>
Pallav Agarwal's avatar
Pallav Agarwal committed
328
                </div>
Pallav Agarwal's avatar
Pallav Agarwal committed
329 330 331 332 333 334 335 336 337 338 339 340 341 342 343 344 345 346 347 348 349 350 351
            </div>
        </div>
    </div>


    <div class="modal fade" id="imagemodal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal">
                        <span aria-hidden="true">&times;</span>
                        <span class="sr-only">Close</span>
                    </button>
                    <h4 class="modal-title" id="myModalLabel">
                        Image Preview
                    </h4>
                </div>
                <div class="modal-body">
                    <img src="" id="imagepreview" style="max-height: 100%; max-width: 100%;">
                </div>
            </div>
        </div>
    </div>