Nvim-Rafce

Write boilerplate React components with one command

TOC

• Problem
• Solution
• Installation
• Commands
• Socials

Problem

1. You left behind VSCode and installed Neovim and are new to learning Vim motions, remaps, plugins, etc. You saw either yourself or other people using the RAFCE snippet to create boilerplate React component code. You want to save time by having something similar for Neovim.

Solution

1. The ability to write a command in Neovim and have boilerplate component code on the fly.

Installation

Installation can be done in 2 ways:

1. Manually

Run the following commands to add nvim-rafce manually

1. Clone repository

git clone [email protected]:Shobhit-Nagpal/nvim-rafce.git

2. Navigate to your neovim config directory

3. In your init.lua or if you have a after/plugin directory, create a file called rafce.lua and add the following lines:

vim.opt.runtimepath:append('/path/to/nvim-rafce')
local rafce = require('rafce')

4. Source the file

:so

2. Plugin manager

-- Lazy.nvim:

{'Shobhit-Nagpal/nvim-rafce',
  config = function()
      require('rafce')
  end,
}

-- Packer:

use 'Shobhit-Nagpal/nvim-rafce'

-- Vim-plug:

Plug 'Shobhit-Nagpal/nvim-rafce'

Commands

There are 3 different commands to use depending on your needs:

i. Rafce (React functional component with arrow function and export at bottom)

:Rafce

import React from "react";

const Component = () => {
  return <div>Component</div>;
};

export default Component;

ii. Rfce (React functional component with export at bottom)

:Rfce

import React from "react";

function Component() {
  return <div>Component</div>;
}

export default Component;

iii. Rfc (React functional component)

:Rfc

import React from "react";

export default function Component() {
  return <div>Component</div>;
}

Socials

• Twitter