Reactでコンポーネントを作るとき、
毎回 import や export を書くのが面倒だと思ったことはありませんか？
rafce スニペットです！
rafce とは？
rafce は React Arrow Function Component Export の略で、
アロー関数で定義された関数コンポーネント＋エクスポート付きのテンプレート を一瞬で生成できます。
実際に rafce を打つとどうなる？
rafceと入力してtabキーを押すと...
import React from 'react';
const ComponentName = () => {
return (
<div>ComponentName</div>
);
};
export default ComponentName;
雛形を作成してくれます！
他にもある便利スニペット
| スニペット | 内容 |
|---|---|
rafce |
アロー関数コンポーネント（exportあり） |
rafc |
アロー関数コンポーネント（exportなし） |
rfc |
通常の関数コンポーネント（exportあり） |
rce |
クラスコンポーネント（exportあり） |
まとめ
rafceをきっかけに他にも色々と便利なスニペットを知りました。
他にも学習したら記録に残していきます。