vim-fidget


Ⅰ. 插件描述

Ⅱ. 基本信息

创建日期:  2014-08-12
使用用户:  9
Github星:  31
插件作者:  mohitleo9

Ⅲ. 安装方法

使用Vundle管理器安装

在你的.vimrc下添加:
Plugin 'mohitleo9/vim-fidget'
… 然后在Vim中运行以下命令:
:source %
:PluginInstall

对于Vundle版本 < 0.10.2,请用上面的Bundle替换Plugin。

使用NeoBundle管理器安装

在你的.vimrc下添加:
NeoBundle 'mohitleo9/vim-fidget'
… 然后在Vim中运行以下命令:
:source %
:NeoBundleInstall

使用VimPlug管理器安装

在你的.vimrc下添加:
Plug 'mohitleo9/vim-fidget'
… 然后在Vim中运行以下命令:
:source %
:PlugInstall

使用Pathogen管理器安装

在终端中运行以下命令:
cd ~/.vim/bundle
git clone https://github.com/mohitleo9/vim-fidget

Ⅳ. 文档说明

# vim-fidget - JsFiddle for Vim

What??

This is a plugin (with a very creative name!) that emulates JsFiddle in vim and lets you post it to actual jsfiddle.com so that it can be shared.
SCREENCAST

Why??

I am a web developer and the whole concept of trying out small chunks of programs makes JsFiddle really cool BUT...

WHERE IS MY VIM....? this plugin answers that (it also does live update say whatt)

Installation

  • Manual installation:

    1. Copy the files to your .vim directory
    2. then run npm install in the repo
  • Pathogen

    • cd ~/.vim/bundle && git clone git://github.com/mohitleo9/vim-fidget.git && npm install
  • Vundle

    1. Add Bundle 'mohitleo9/vim-fidget' to .vimrc
    2. Run :BundleInstall
    3. Then go to the bundle/vim-fidget && run npm install
  • NeoBundle

    1. Add

      NeoBundle 'mohitleo9/vim-fidget',{
          \ 'build' : {
          \    'unix' : 'npm install',
          \    'mac' : 'npm install',
          \ },
      \} 

      to .vimrc

    2. Run :NeoBundleInstall

How to use ??

It adds two commands

VimFidget : create a fidget and open a browser window for live preview

VimFidgetBrowse : upload the fidget to jsfiddle
Also the server dies when you quit index.html buffer

Amending the default templates

You can change the template files in bundle/vim-fidget/template to include
stuff that you frequently use. For example, if you work locally and would like a base Fidget that includes jQuery, Modernizr and a meta tag for correct display of HTML on mobile devices you could:

  • download jQuery and Modernizr to your template folder
  • amend the index.html file as follows:
<!doctype html>
<html>
    <head>
        <meta charset="utf-8">
        <title>Vim Fidget</title>
        <script src="socket.io.js"></script>
        <script src="socket_client.js"></script>
        <script src="jquery-2.1.1.min.js"></script>
        <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, user-scalable=no">
        <link rel="stylesheet" href="main.css" type="text/css" media="all" />
        <script src="modernizr.dev.2.8.3.js"></script>
    </head>
    <body>
        <div class="thing">

        </div>
        <script src="main.js"></script>
    </body>
</html>

You can also alter the default CSS (main.css) and JS (main.js) in the same manner.

Credits:

That's it for today Folks!!!

添加新评论