New Component screenshot

New Component

Author Avatar Theme by Joshwcomeau
Updated: 12 Dec 2024
759 Stars

CLI utility for quickly creating new React components.

Overview

Creating new React components can be a tedious process, especially when it comes to setting up boilerplate code. The new-component utility simplifies this task by offering a command-line interface (CLI) tool that rapidly scaffolds new components with all necessary files generated automatically. Although it’s a simple and customizable utility, users need to be aware that this project is not actively maintained, leaving room for personal tweaks and adjustments.

Whether you are developing a React application and want to enhance your workflow or just looking for a more efficient way to create components, the new-component utility is an interesting tool worth exploring. With features tailored to streamline the process, it can be particularly valuable for projects where consistent formatting and quick setup are remarkable priorities.

Features

  • Simple CLI Interface: Easily add new React components through a straightforward command-line interface that simplifies the process.
  • Prettier Integration: Automatically formats created files to match the existing Prettier configuration of your project, ensuring consistent styling.
  • Global and Local Configuration: Supports a global configuration file that can be overridden per project, allowing for flexible setup adjustments.
  • Colourful Terminal Output: Enjoy vibrant output in your terminal, making it easier to track processes and actions.
  • TypeScript Support: With Version 5, the tool adds support for TypeScript, providing more options for developers working with different programming languages.
  • Custom Directory Creation: Automatically creates a new directory for each component in the default ‘src/components’ folder, facilitating organized project structure.
  • Cross-Platform Potential: Although primarily tested on macOS, users may find it functions well on Linux, making it a versatile choice for many developers.
  • Custom Language Control: Choose between JavaScript and TypeScript when generating files, with specific commands available for setting the desired language.