emmet-vim-react-snippets


Ⅰ. 插件描述

Vim version of the snippets from Emmet-vim

Ⅱ. 基本信息

创建日期:  2015-07-01
使用用户:  1
Github星:  8
插件作者:  Teng Du

Ⅲ. 安装方法

使用Vundle管理器安装

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

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

使用NeoBundle管理器安装

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

使用VimPlug管理器安装

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

使用Pathogen管理器安装

在终端中运行以下命令:
cd ~/.vim/bundle
git clone https://github.com/duteng/emmet-vim-react-snippets

Ⅳ. 文档说明

# emmet-vim-react-snippets

What it will looks like:

emmet-vim-react-snippets

How to config:

1.Using Vundle to install the following plugins:

Plugin 'vim-scripts/Emmet.vim'
Plugin 'vim-scripts/WebAPI.vim'

2.Next you need to add this to your ~/.vimrc:

let g:user_emmet_settings = webapi#json#decode(
\  join(readfile(expand('~/.snippets.json')), "\n"))

3.Edit your ~/.snippets.json as following:

{
    "javascript": {
        "snippets": {
            "rcc": "var React = require('react');\nvar ${cursor} = React.createClass({\n\trender: function() {\n\t\treturn (\n\t\n\t\t);\n\t}\n});",

            "pt": "propTypes: {\n\t${cursor}\n},",
            "gdp": "getDefaultProps: function() {\n\treturn {\n\t${cursor}\n\t};\n},",
            "gis": "getInitialState: function() {\n\treturn {\n\t${cursor}\n\t};\n},",

            "cdm": "componentDidMount: function() { \n\t${cursor} \n},",
            "cwm": "componentWillMount: function() {\n\t${cursor}\n},",
            "cdup": "componentDidUpdate: function(prevProps, prevState) {\n\t${cursor}\n},",
            "crw": "componentWillReceiveProps: function(nextProps) {\n\t${cursor}\n},",
            "cwun": "componentWillUnmount: function() {\n\t${cursor}\n},",
            "cwu": "componentWillUpdate: function(nextProps, nextState) {\n\t${cursor}\n},",
            "sst": "setState({\n\t${cursor}\n});"
        }
    },
    "jsx": {
        "snippets": {
            "extends": "javascript"
        }
    }
}

Done, enjoy!

添加新评论