Use zx

Author: onlywei

package.json

@@ -17,7 +17,7 @@
     "oxlint": "^1.36.0",
     "vite": "catalog:",
     "vitest": "catalog:",
-    "zx": "^8.8.5"
+    "zx": "catalog:"
   },
   "packageManager": "pnpm@10.26.2+sha512.0e308ff2005fc7410366f154f625f6631ab2b16b1d2e70238444dd6ae9d630a8482d92a451144debc492416896ed16f7b114a86ec68b8404b2443869e68ffda6",
   "pnpm": {

packages/create-vite-app/package.json

@@ -36,12 +36,13 @@
     "test": "node --test"
   },
   "dependencies": {
-    "@clack/prompts": "^0.11.0"
+    "@clack/prompts": "^0.11.0",
+    "zx": "catalog:"
   },
   "devDependencies": {
+    "@types/fs-extra": "^11.0.4",
     "@types/node": "catalog:",
-    "typescript": "catalog:",
-    "yaml": "^2.8.2"
+    "typescript": "catalog:"
   },
   "engines": {
     "node": ">=22.18.0"

packages/create-vite-app/scripts/copy-examples.ts

@@ -1,41 +1,14 @@
-import { cpSync, existsSync, mkdirSync, readdirSync, rmSync } from 'node:fs'
 import { join } from 'node:path'
+import { fs } from 'zx'
 
 const rootDir = join(import.meta.dirname, '..', '..', '..')
 const pkgDir = join(import.meta.dirname, '..')
 
-const SKIP_PATTERNS = ['node_modules', 'dist', '.test.js', '.test.ts']
-
-function shouldSkip(name: string): boolean {
-  return SKIP_PATTERNS.some((pattern) => name.includes(pattern))
-}
-
-function copyTemplate(src: string, dest: string): void {
-  const entries = readdirSync(src, { withFileTypes: true })
-
-  for (const entry of entries) {
-    if (shouldSkip(entry.name)) continue
-
-    const srcPath = join(src, entry.name)
-    const destPath = join(dest, entry.name)
-
-    if (entry.isDirectory()) {
-      mkdirSync(destPath, { recursive: true })
-      copyTemplate(srcPath, destPath)
-    } else {
-      cpSync(srcPath, destPath)
-    }
-  }
-}
-
 const templateSrc = join(rootDir, 'examples', 'react-vanilla-spa')
 const templateDest = join(pkgDir, 'templates', 'react-spa')
 
-// Clean and recreate templates directory
-if (existsSync(join(pkgDir, 'templates'))) {
-  rmSync(join(pkgDir, 'templates'), { recursive: true })
-}
-mkdirSync(templateDest, { recursive: true })
-
-copyTemplate(templateSrc, templateDest)
+fs.removeSync(join(pkgDir, 'templates'))
+fs.copySync(templateSrc, templateDest, {
+  filter: (src) => !src.includes('node_modules') && !src.includes('.test.'),
+})
 console.log('Copied template files to templates/react-spa')

packages/create-vite-app/scripts/generate-versions.ts

@@ -1,23 +1,17 @@
-import { readFileSync, writeFileSync } from 'node:fs'
 import { join } from 'node:path'
-import { parse } from 'yaml'
+import { fs, YAML } from 'zx'
 
 const rootDir = join(import.meta.dirname, '..', '..', '..')
 const pkgDir = join(import.meta.dirname, '..')
 
-// Read pnpm-workspace.yaml
-const workspaceYaml = readFileSync(join(rootDir, 'pnpm-workspace.yaml'), 'utf-8')
-const workspace = parse(workspaceYaml) as {
+const workspaceYaml = fs.readFileSync(join(rootDir, 'pnpm-workspace.yaml'), 'utf-8')
+const workspace = YAML.parse(workspaceYaml) as {
   catalog: Record<string, string>
   catalogs: Record<string, Record<string, string>>
 }
 
-// Read @fastify/vite version from its package.json
-const fastifyVitePkg = JSON.parse(
-  readFileSync(join(rootDir, 'packages', 'fastify-vite', 'package.json'), 'utf-8'),
-)
+const fastifyVitePkg = fs.readJsonSync(join(rootDir, 'packages', 'fastify-vite', 'package.json'))
 
-// Build the versions object
 const versions: Record<string, string> = {
   '@fastify/vite': `^${fastifyVitePkg.version}`,
   fastify: workspace.catalog.fastify,
@@ -27,7 +21,6 @@ const versions: Record<string, string> = {
   '@vitejs/plugin-react': workspace.catalogs.react['@vitejs/plugin-react'],
 }
 
-// Generate the versions.json file
 const versionsPath = join(pkgDir, 'src', 'versions.json')
-writeFileSync(versionsPath, JSON.stringify(versions, null, 2) + '\n')
+fs.writeJsonSync(versionsPath, versions, { spaces: 2 })
 console.log('Generated src/versions.json with versions:', versions)

packages/create-vite-app/src/index.ts

@@ -1,45 +1,18 @@
 #!/usr/bin/env node
 
-import { cpSync, existsSync, mkdirSync, readFileSync, readdirSync, writeFileSync } from 'node:fs'
 import { join } from 'node:path'
-import { spawn } from 'node:child_process'
 import * as p from '@clack/prompts'
+import { $, fs } from 'zx'
 import versions from './versions.json' with { type: 'json' }
 
 const TEMPLATE_DIR = join(import.meta.dirname, '..', 'templates', 'react-spa')
 
-const SKIP_PATTERNS = ['node_modules', 'dist', '.test.js', '.test.ts']
-
-function shouldSkip(name: string): boolean {
-  return SKIP_PATTERNS.some((pattern) => name.includes(pattern))
-}
-
-function copyTemplate(src: string, dest: string): void {
-  const entries = readdirSync(src, { withFileTypes: true })
-
-  for (const entry of entries) {
-    if (shouldSkip(entry.name)) continue
-
-    const srcPath = join(src, entry.name)
-    const destPath = join(dest, entry.name)
-
-    if (entry.isDirectory()) {
-      mkdirSync(destPath, { recursive: true })
-      copyTemplate(srcPath, destPath)
-    } else {
-      cpSync(srcPath, destPath)
-    }
-  }
-}
-
 function transformPackageJson(projectName: string, destDir: string): void {
   const pkgPath = join(destDir, 'package.json')
-  const pkg = JSON.parse(readFileSync(pkgPath, 'utf-8'))
+  const pkg = fs.readJsonSync(pkgPath)
 
-  // Update name
   pkg.name = projectName
 
-  // Replace workspace: and catalog: references with actual versions
   for (const depType of ['dependencies', 'devDependencies'] as const) {
     if (!pkg[depType]) continue
     for (const [name, version] of Object.entries(pkg[depType])) {
@@ -55,14 +28,12 @@ function transformPackageJson(projectName: string, destDir: string): void {
     }
   }
 
-  // Remove private flag for user projects
   delete pkg.private
 
-  writeFileSync(pkgPath, JSON.stringify(pkg, null, 2) + '\n')
+  fs.writeJsonSync(pkgPath, pkg, { spaces: 2 })
 }
 
 function detectPackageManager(): 'pnpm' | 'yarn' | 'bun' | 'npm' {
-  // Check npm_config_user_agent (set when running via package manager)
   const userAgent = process.env.npm_config_user_agent
   if (userAgent) {
     if (userAgent.includes('pnpm')) return 'pnpm'
@@ -72,25 +43,9 @@ function detectPackageManager(): 'pnpm' | 'yarn' | 'bun' | 'npm' {
   return 'npm'
 }
 
-async function installDependencies(pm: string, cwd: string): Promise<void> {
-  return new Promise((resolve, reject) => {
-    const child = spawn(pm, ['install'], {
-      cwd,
-      stdio: 'inherit',
-      shell: process.platform === 'win32',
-    })
-    child.on('close', (code) => {
-      if (code === 0) resolve()
-      else reject(new Error(`${pm} install failed with code ${code}`))
-    })
-    child.on('error', reject)
-  })
-}
-
 async function main(): Promise<void> {
   p.intro('Create Fastify + Vite App')
 
-  // Get project name from CLI arg or prompt
   let projectName = process.argv[2]
 
   if (!projectName) {
@@ -100,7 +55,7 @@ async function main(): Promise<void> {
       defaultValue: 'my-fastify-app',
       validate: (value) => {
         if (!value) return 'Project name is required'
-        if (existsSync(value)) return `Directory "${value}" already exists`
+        if (fs.existsSync(value)) return `Directory "${value}" already exists`
       },
     })
 
@@ -114,33 +69,33 @@ async function main(): Promise<void> {
 
   const destDir = join(process.cwd(), projectName)
 
-  // Check if directory already exists
-  if (existsSync(destDir)) {
+  if (fs.existsSync(destDir)) {
     p.cancel(`Directory "${projectName}" already exists`)
     process.exit(1)
   }
 
-  // Copy template
   const copySpinner = p.spinner()
   copySpinner.start('Copying template files...')
 
   try {
-    mkdirSync(destDir, { recursive: true })
-    copyTemplate(TEMPLATE_DIR, destDir)
+    await fs.copy(TEMPLATE_DIR, destDir, {
+      filter: (src) => !src.includes('node_modules') && !src.includes('.test.'),
+    })
     transformPackageJson(projectName, destDir)
     copySpinner.stop('Template files copied')
   } catch (error) {
     copySpinner.stop('Failed to copy template')
     throw error
   }
 
-  // Install dependencies
   const pm = detectPackageManager()
   const installSpinner = p.spinner()
   installSpinner.start(`Installing dependencies with ${pm}...`)
 
   try {
-    await installDependencies(pm, destDir)
+    $.cwd = destDir
+    $.quiet = true
+    await $`${pm} install`
     installSpinner.stop('Dependencies installed')
   } catch {
     installSpinner.stop(`Failed to install dependencies. Run "${pm} install" manually.`)