📝
NodejsでNextjsとReactのコンポーネントを作成するコマンドを作ってみた。
NodejsでNextjsとReactのコンポーネントを作成するコマンドを作ってみた。
NextjsとReactにはコンポーネントを自動で作成するLaravelのartisan のようなコマンドがなかったので、遊びのつもりで作ってみました。
インストール
npm i create-component-skelton
コマンドの書式は
npx create-component-skelton mode コンポーネントネーム...
npx create-component-skelton component Header Footer ...
npx create-component-skelton page Header Footer ...
モードは2つ
componentの場合は
/プロジェクトディレクトリ/src/components配下にHeader.tsx, Footer.tsx ....tsxが作成されます。
pageの場合は
nextjsのpagesディレクトリでの作成を想定しています。
/プロジェクトディレクトリ/src/pages配下にHeaderPage.tsx, FooterPage.tsx ...Page.tsxが作成されます。
同じ名前が存在している場合は作成はされません。
作成されるファイルのスケルトン
下記のファイルの
Component、Pageはコマンドで入力したコンポーネントネームに書き換わります。
PropsTypeは先頭にコンポーネントネームが自動で追加されます。
import React from 'react';
import { FC } from 'react';
interface PropsType {}
const Component: FC<PropsType> = () => {
return (
<></>
);
};
export default Component;
import React from 'react';
import { FC } from 'react';
interface PropsType {}
const Page: FC<PropsType> = () => {
return (
<></>
);
};
export default Page;
export const getServerSideProps = () => {
return {
props: {
}
};
};
使っていただけたら幸いです。
バグが見つかったら、コメントで教えてください
よろしくお願いいたします。
Discussion