Tools
mkcom a sh script for creating React components
Tool 2
Tool 3
mkcom
1#!/bin/bash
2
3if [ -z "$1" ]; then
4    echo "Usage: mkcom <ComponentName>"
5    exit 1
6fi
7
8COMPONENT_NAME=$1
9COMPONENT_NAME_LOWERCASE=$(echo "$COMPONENT_NAME" | tr '[:upper:]' '[:lower:]')
10COMPONENT_DIR="components/$COMPONENT_NAME"
11
12mkdir -p "$COMPONENT_DIR"
13
14cd "$COMPONENT_DIR" || exit
15
16touch "$COMPONENT_NAME.tsx" "$COMPONENT_NAME.module.scss" "index.ts"
17
18echo "export { $COMPONENT_NAME } from './$COMPONENT_NAME';" >index.ts
19
20cat <<EOF >"$COMPONENT_NAME.tsx"
21import styles from './$COMPONENT_NAME.module.scss';
22
23export function ${COMPONENT_NAME}() {
24    return (
25        <div className={styles.$COMPONENT_NAME_LOWERCASE}>
26            <h2>$COMPONENT_NAME</h2>
27        </div>
28    );
29};
30EOF
31
32cat <<EOF >"$COMPONENT_NAME.module.scss"
33.$COMPONENT_NAME_LOWERCASE {
34    color: var(--color);
35}
36EOF
37
38echo "✅ $COMPONENT_NAME created in components/$COMPONENT_NAME"
39
40code "$COMPONENT_NAME.tsx" "$COMPONENT_NAME.module.scss"
41
NORMALFILE
show cmds /
Updated
MMM DD YY HH:MM
Commands