create-jsc-vite-react-ts 1.0.2 → 1.2.0

package/bin/cli.js

@@ -1,113 +1,131 @@
 #!/usr/bin/env node
 
-import { execSync } from 'child_process'
-import fs from 'fs-extra'
-import path from 'path'
-import { fileURLToPath } from 'url'
-import prompts from 'prompts'
-import chalk from 'chalk'
+import { execSync } from "child_process";
+import fs from "fs-extra";
+import path from "path";
+import { fileURLToPath } from "url";
+import prompts from "prompts";
+import chalk from "chalk";
 
-const __filename = fileURLToPath(import.meta.url)
-const __dirname = path.dirname(__filename)
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = path.dirname(__filename);
 
 const run = async () => {
-  console.log(chalk.bold.cyan('\n🚀 Create React + TypeScript + Vite App\n'))
+  console.log(chalk.bold.cyan("\n🚀 Create React + TypeScript + Vite App\n"));
 
-  const args = process.argv.slice(2)
-  let projectName = args[0]
+  const args = process.argv.slice(2);
+  let projectName = args[0];
 
   if (!projectName) {
     const response = await prompts({
-      type: 'text',
-      name: 'projectName',
-      message: 'What is your project named?',
-      initial: 'my-app',
+      type: "text",
+      name: "projectName",
+      message: "What is your project named?",
+      initial: "my-app",
       validate: (value) => {
-        if (!value) return 'Project name is required'
+        if (!value) return "Project name is required";
         if (!/^[a-z0-9-_]+$/.test(value)) {
-          return 'Project name can only contain lowercase letters, numbers, hyphens, and underscores'
+          return "Project name can only contain lowercase letters, numbers, hyphens, and underscores";
         }
-        return true
+        return true;
       },
-    })
+    });
 
     if (!response.projectName) {
-      console.log(chalk.red('\n✖ Project creation cancelled\n'))
-      process.exit(1)
+      console.log(chalk.red("\n✖ Project creation cancelled\n"));
+      process.exit(1);
     }
 
-    projectName = response.projectName
+    projectName = response.projectName;
   }
 
-  const targetDir = path.resolve(process.cwd(), projectName)
+  const targetDir = path.resolve(process.cwd(), projectName);
 
   if (fs.existsSync(targetDir)) {
-    console.log(chalk.red(`\n✖ Directory ${projectName} already exists\n`))
-    process.exit(1)
+    console.log(chalk.red(`\n✖ Directory ${projectName} already exists\n`));
+    process.exit(1);
   }
 
-  console.log(chalk.blue(`\n📁 Creating project in ${targetDir}...\n`))
+  console.log(chalk.blue(`\n📁 Creating project in ${targetDir}...\n`));
 
-  const templateDir = path.resolve(__dirname, '../template')
+  const templateDir = path.resolve(__dirname, "../template");
   fs.copySync(templateDir, targetDir, {
     filter: (src) => {
-      const basename = path.basename(src)
-      return !['node_modules', 'dist', 'coverage', '.claude', 'plan.md', 'CLAUDE.md', 'yarn.lock'].includes(basename)
+      const basename = path.basename(src);
+      return !["node_modules", "dist", "coverage", "yarn.lock"].includes(
+        basename,
+      );
     },
-  })
+  });
+
+  // Make files fromthe "scripts" folder executable
+  const scriptsDir = path.join(targetDir, "scripts");
+  if (fs.existsSync(scriptsDir)) {
+    const scriptFiles = fs.readdirSync(scriptsDir);
+    scriptFiles.forEach((file) => {
+      const filePath = path.join(scriptsDir, file);
+      fs.chmodSync(filePath, 0o755);
+    });
+  }
 
-  const packageJsonPath = path.join(targetDir, 'package.json')
-  const packageJson = fs.readJsonSync(packageJsonPath)
-  packageJson.name = projectName
-  fs.writeJsonSync(packageJsonPath, packageJson, { spaces: 2 })
+  const packageJsonPath = path.join(targetDir, "package.json");
+  const packageJson = fs.readJsonSync(packageJsonPath);
+  packageJson.name = projectName;
+  fs.writeJsonSync(packageJsonPath, packageJson, { spaces: 2 });
 
-  console.log(chalk.green('✓ Project files created'))
+  console.log(chalk.green("✓ Project files created"));
 
-  const packageManager = await detectPackageManager()
+  const packageManager = await detectPackageManager();
 
-  console.log(chalk.blue(`\n📦 Installing dependencies with ${packageManager}...\n`))
+  console.log(
+    chalk.blue(`\n📦 Installing dependencies with ${packageManager}...\n`),
+  );
 
   try {
     execSync(`${packageManager} install`, {
       cwd: targetDir,
-      stdio: 'inherit',
-    })
-    console.log(chalk.green('\n✓ Dependencies installed'))
+      stdio: "inherit",
+    });
+    console.log(chalk.green("\n✓ Dependencies installed"));
   } catch (error) {
-    console.log(chalk.yellow('\n⚠ Failed to install dependencies automatically'))
-    console.log(chalk.yellow(`  Please run "${packageManager} install" manually\n`))
+    console.log(
+      chalk.yellow("\n⚠ Failed to install dependencies automatically"),
+    );
+    console.log(
+      chalk.yellow(`  Please run "${packageManager} install" manually\n`),
+    );
   }
 
-  console.log(chalk.bold.green('\n✨ Success! Your project is ready.\n'))
-  console.log(chalk.bold('Next steps:\n'))
-  console.log(chalk.cyan(`  cd ${projectName}`))
-  console.log(chalk.cyan(`  ${packageManager} dev`))
-  console.log()
-}
+  console.log(chalk.bold.green("\n✨ Success! Your project is ready.\n"));
+  console.log(chalk.bold("Next steps:\n"));
+  console.log(chalk.cyan(`  cd ${projectName}`));
+  console.log(chalk.cyan(`  ${packageManager} dev`));
+  console.log();
+};
 
 const detectPackageManager = async () => {
-  const userAgent = process.env.npm_config_user_agent || ''
+  const userAgent = process.env.npm_config_user_agent || "";
 
-  if (userAgent.startsWith('yarn')) return 'yarn'
-  if (userAgent.startsWith('pnpm')) return 'pnpm'
+  if (userAgent.startsWith("yarn")) return "yarn";
+  if (userAgent.startsWith("pnpm")) return "pnpm";
 
   const response = await prompts({
-    type: 'select',
-    name: 'packageManager',
-    message: 'Which package manager do you want to use?',
+    type: "select",
+    name: "packageManager",
+    message: "Which package manager do you want to use?",
     choices: [
-      { title: 'npm', value: 'npm' },
-      { title: 'yarn', value: 'yarn' },
-      { title: 'pnpm', value: 'pnpm' },
+      { title: "npm", value: "npm" },
+      { title: "yarn", value: "yarn" },
+      { title: "pnpm", value: "pnpm" },
     ],
     initial: 0,
-  })
+  });
 
-  return response.packageManager || 'npm'
-}
+  return response.packageManager || "npm";
+};
 
 run().catch((error) => {
-  console.error(chalk.red('\n✖ An error occurred:\n'))
-  console.error(error)
-  process.exit(1)
-})
+  console.error(chalk.red("\n✖ An error occurred:\n"));
+  console.error(error);
+  process.exit(1);
+});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-jsc-vite-react-ts",
-  "version": "1.0.2",
+  "version": "1.2.0",
   "description": "Create a modern React app with TypeScript, Vite, Tailwind CSS, and Vitest",
   "type": "module",
   "bin": {

package/template/.prettierrc

@@ -0,0 +1,7 @@
+{
+  "semi": false,
+  "trailingComma": "all",
+  "singleQuote": true,
+  "printWidth": 80,
+  "plugins": ["prettier-plugin-organize-imports"]
+}

package/template/package.json

@@ -10,7 +10,11 @@
     "preview": "vite preview",
     "test": "vitest",
     "test:ui": "vitest --ui",
-    "test:coverage": "vitest --coverage"
+    "test:coverage": "vitest --coverage",
+    "format": "prettier --write .",
+    "update-version": "./update-version.sh",
+    "create-tag": "./create-tag.sh",
+    "full-tag": "yarn update-version && yarn create-tag"
   },
   "dependencies": {
     "react": "^19.2.0",
@@ -34,6 +38,8 @@
     "eslint-plugin-react-refresh": "^0.4.24",
     "globals": "^16.5.0",
     "jsdom": "^27.3.0",
+    "prettier": "^3.7.4",
+    "prettier-plugin-organize-imports": "^4.3.0",
     "tailwindcss": "^4.0.0",
     "typescript": "~5.9.3",
     "typescript-eslint": "^8.46.4",

package/template/scripts/create-tag.sh

@@ -0,0 +1,9 @@
+#!/bin/bash
+echo "🏷️ Creating new git tag"
+
+. "$(dirname "$0")/get-tag.sh"
+git tag "v$NEW_TAG"
+echo "🔖 New tag created: v$NEW_TAG"
+git push origin
+git push origin "v$NEW_TAG"
+echo "🚀 Tag creation completed."

package/template/scripts/get-tag.sh

@@ -0,0 +1,17 @@
+#!/bin/bash
+
+# Get the latest git tag that starts with 'v'
+LATEST_TAG=$(git tag -l --sort=version:refname | grep "^v" | tail -1)
+
+# Increment the patch version of the latest tag
+if [ -z "$LATEST_TAG" ]; then
+    NEW_TAG="0.0.1"
+else
+    MAJOR=$(echo "$LATEST_TAG" | sed 's/^v//' | awk -F"." '{print $1}')
+    MINOR=$(echo "$LATEST_TAG" | sed 's/^v//' | awk -F"." '{print $2}')
+    PATCH=$(echo "$LATEST_TAG" | sed 's/^v//' | awk -F"." '{print $3}')
+    PATCH=$((PATCH + 1))
+    NEW_TAG="$MAJOR.$MINOR.$PATCH"
+fi
+
+export NEW_TAG

package/template/scripts/update-version.sh

@@ -0,0 +1,24 @@
+# !/bin/bash
+
+echo "🚀 Updating version"
+
+. "$(dirname "$0")/get-tag.sh"
+
+# Echo the new tag version
+echo "🆕 New tag version will be: $NEW_TAG"
+
+# Update the version field in package.json
+PACKAGE_JSON_PATH="package.json"
+if [ -f "$PACKAGE_JSON_PATH" ]; then
+    # Use jq to update the version field
+    jq --arg new_version "$NEW_TAG" '.version = $new_version' "$PACKAGE_JSON_PATH" > "${PACKAGE_JSON_PATH}.tmp" && mv "${PACKAGE_JSON_PATH}.tmp" "$PACKAGE_JSON_PATH"
+    echo "📦 Updated package.json version to $NEW_TAG"
+fi
+
+git add "$PACKAGE_JSON_PATH"
+git commit -m "chore: bump version to $NEW_TAG"
+
+# Echo a message indicating the pre-push hook is running with emoji
+echo "🚀 Version updated."
+
+exit 0