react/fc

Creates a React Functional Component.

Usage

npx @lukasbach/scripts react/fc

You can call the script directly if you have installed it globally:

npm i -g @lukasbach/scripts
ldo react/fc

There is a default shortcut for this script: ldo fc

You can customize shortcuts with ldo edit-shortcuts.

Arguments

• [0]: React component name

Options

• -v, --verbose: Verbose logging

You can also omit options, and will be asked for them interactively.

Add --yes to skip all confirmations.

Script source

View Source on GitHub

/** Creates a React Functional Component. */

const componentName = await ask.text("_", "React component name", "MyComponent");
const content = utils.noindent(`
  import { FC } from "react";
  
  export const ${utils.changeCase.pascalCase(componentName)}: FC<{}> = ({}) => {
    return (
      <>
        hello
      </>
    );
  };
  `);

await fs.writeFile(path.join(process.cwd(), `${utils.changeCase.kebabCase(componentName)}.tsx`), content);