create-fluxstack 1.0.15 → 1.0.18

package/core/build/bundler.ts

@@ -0,0 +1,169 @@
+import { spawn } from "bun"
+import { existsSync, mkdirSync } from "fs"
+import { join } from "path"
+import type { FluxStackConfig } from "../config"
+import type { BundleResult, BundleOptions } from "../types/build"
+
+export interface BundlerConfig {
+  target: 'bun' | 'node' | 'docker'
+  outDir: string
+  sourceMaps: boolean
+  external?: string[]
+  minify?: boolean
+}
+
+export class Bundler {
+  private config: BundlerConfig
+
+  constructor(config: BundlerConfig) {
+    this.config = config
+  }
+
+  async bundleClient(options: BundleOptions = {}): Promise<BundleResult> {
+    console.log("⚡ Bundling client...")
+    
+    const startTime = Date.now()
+    
+    try {
+      const buildProcess = spawn({
+        cmd: ["bunx", "vite", "build", "--config", "vite.config.ts"],
+        cwd: process.cwd(),
+        stdout: "pipe",
+        stderr: "pipe",
+        env: {
+          ...process.env,
+          VITE_BUILD_OUTDIR: this.config.outDir,
+          VITE_BUILD_MINIFY: (this.config.minify || false).toString(),
+          VITE_BUILD_SOURCEMAPS: this.config.sourceMaps.toString(),
+          ...options.env
+        }
+      })
+
+      const exitCode = await buildProcess.exited
+      const duration = Date.now() - startTime
+      
+      if (exitCode === 0) {
+        console.log("✅ Client bundle completed")
+        return {
+          success: true,
+          duration,
+          outputPath: this.config.outDir,
+          assets: await this.getClientAssets()
+        }
+      } else {
+        const stderr = await new Response(buildProcess.stderr).text()
+        console.error("❌ Client bundle failed")
+        return {
+          success: false,
+          duration,
+          error: stderr || "Client build failed"
+        }
+      }
+    } catch (error) {
+      const duration = Date.now() - startTime
+      return {
+        success: false,
+        duration,
+        error: error instanceof Error ? error.message : "Unknown error"
+      }
+    }
+  }
+
+  async bundleServer(entryPoint: string, options: BundleOptions = {}): Promise<BundleResult> {
+    console.log("⚡ Bundling server...")
+    
+    const startTime = Date.now()
+    
+    try {
+      // Ensure output directory exists
+      if (!existsSync(this.config.outDir)) {
+        mkdirSync(this.config.outDir, { recursive: true })
+      }
+
+      const external = [
+        "@tailwindcss/vite",
+        "tailwindcss", 
+        "lightningcss",
+        "vite",
+        "@vitejs/plugin-react",
+        ...(this.config.external || []),
+        ...(options.external || [])
+      ]
+
+      const buildArgs = [
+        "bun", "build", 
+        entryPoint, 
+        "--outdir", this.config.outDir,
+        "--target", this.config.target,
+        ...external.flatMap(ext => ["--external", ext])
+      ]
+
+      if (this.config.sourceMaps) {
+        buildArgs.push("--sourcemap")
+      }
+
+      if (this.config.minify) {
+        buildArgs.push("--minify")
+      }
+
+      const buildProcess = spawn({
+        cmd: buildArgs,
+        stdout: "pipe",
+        stderr: "pipe",
+        env: {
+          ...process.env,
+          ...options.env
+        }
+      })
+
+      const exitCode = await buildProcess.exited
+      const duration = Date.now() - startTime
+      
+      if (exitCode === 0) {
+        console.log("✅ Server bundle completed")
+        return {
+          success: true,
+          duration,
+          outputPath: this.config.outDir,
+          entryPoint: join(this.config.outDir, "index.js")
+        }
+      } else {
+        const stderr = await new Response(buildProcess.stderr).text()
+        console.error("❌ Server bundle failed")
+        return {
+          success: false,
+          duration,
+          error: stderr || "Server build failed"
+        }
+      }
+    } catch (error) {
+      const duration = Date.now() - startTime
+      return {
+        success: false,
+        duration,
+        error: error instanceof Error ? error.message : "Unknown error"
+      }
+    }
+  }
+
+  private async getClientAssets(): Promise<string[]> {
+    // This would analyze the build output to get asset information
+    // For now, return empty array - can be enhanced later
+    return []
+  }
+
+  async bundle(clientEntry?: string, serverEntry?: string, options: BundleOptions = {}): Promise<{
+    client: BundleResult
+    server: BundleResult
+  }> {
+    const [clientResult, serverResult] = await Promise.all([
+      clientEntry ? this.bundleClient(options) : Promise.resolve({ success: true, duration: 0 } as BundleResult),
+      serverEntry ? this.bundleServer(serverEntry, options) : Promise.resolve({ success: true, duration: 0 } as BundleResult)
+    ])
+
+    return {
+      client: clientResult,
+      server: serverResult
+    }
+  }
+}

package/core/build/index.ts

@@ -0,0 +1,386 @@
+import { copyFileSync, writeFileSync, existsSync, mkdirSync } from "fs"
+import { join } from "path"
+import type { FluxStackConfig } from "../config"
+import type { BuildResult, BuildManifest } from "../types/build"
+import { Bundler } from "./bundler"
+import { Optimizer } from "./optimizer"
+
+export class FluxStackBuilder {
+  private config: FluxStackConfig
+  private bundler: Bundler
+  private optimizer: Optimizer
+
+  constructor(config: FluxStackConfig) {
+    this.config = config
+    
+    // Initialize bundler with configuration
+    this.bundler = new Bundler({
+      target: config.build.target,
+      outDir: config.build.outDir,
+      sourceMaps: config.build.sourceMaps,
+      minify: config.build.minify,
+      external: config.build.external
+    })
+    
+    // Initialize optimizer with configuration
+    this.optimizer = new Optimizer({
+      minify: config.build.minify,
+      treeshake: config.build.treeshake,
+      compress: config.build.compress || false,
+      removeUnusedCSS: config.build.removeUnusedCSS || false,
+      optimizeImages: config.build.optimizeImages || false,
+      bundleAnalysis: config.build.bundleAnalysis || false
+    })
+  }
+
+  async buildClient() {
+    return await this.bundler.bundleClient({
+      env: {
+        VITE_BUILD_OUTDIR: this.config.client.build.outDir,
+        VITE_BUILD_MINIFY: this.config.client.build.minify.toString(),
+        VITE_BUILD_SOURCEMAPS: this.config.client.build.sourceMaps.toString()
+      }
+    })
+  }
+
+  async buildServer() {
+    return await this.bundler.bundleServer("app/server/index.ts")
+  }
+
+  async createDockerFiles() {
+    console.log("🐳 Creating Docker files...")
+    
+    const distDir = this.config.build.outDir
+    console.log(`📁 Output directory: ${distDir}`)
+    
+    // Ensure dist directory exists
+    if (!existsSync(distDir)) {
+      console.log(`📁 Creating directory: ${distDir}`)
+      mkdirSync(distDir, { recursive: true })
+      console.log(`✅ Directory created successfully`)
+    } else {
+      console.log(`✅ Directory already exists`)
+    }
+    
+    // Dockerfile optimizado para produção
+    const dockerfile = `# FluxStack Production Docker Image
+FROM oven/bun:1.1-alpine AS production
+
+WORKDIR /app
+
+# Copy package.json first for better caching
+COPY package.json ./
+
+# Install dependencies
+RUN bun install --frozen-lockfile
+
+# Copy built application
+COPY . .
+
+# Create non-root user
+RUN addgroup -g 1001 -S fluxstack && \\
+    adduser -S fluxstack -u 1001
+
+# Set permissions
+RUN chown -R fluxstack:fluxstack /app
+USER fluxstack
+
+# Environment variables
+ENV NODE_ENV=production
+ENV PORT=3000
+
+# Health check
+HEALTHCHECK --interval=30s --timeout=3s --start-period=5s --retries=3 \\
+  CMD bun run -e "fetch('http://localhost:3000/api/health').then(r => r.ok ? process.exit(0) : process.exit(1))" || exit 1
+
+# Expose port
+EXPOSE 3000
+
+# Start the application
+CMD ["bun", "run", "index.js"]
+`
+
+    // docker-compose.yml para deploy rápido
+    const dockerCompose = `version: '3.8'
+
+services:
+  fluxstack:
+    build: .
+    ports:
+      - "3000:3000"
+    environment:
+      - NODE_ENV=production
+      - PORT=3000
+    restart: unless-stopped
+    healthcheck:
+      test: ["CMD", "bun", "run", "-e", "fetch('http://localhost:3000/api/health').then(r => r.ok ? process.exit(0) : process.exit(1))"]
+      interval: 30s
+      timeout: 3s
+      retries: 3
+    deploy:
+      resources:
+        limits:
+          memory: 512M
+        reservations:
+          memory: 256M
+
+  # Opcional: adicionar nginx reverse proxy
+  # nginx:
+  #   image: nginx:alpine
+  #   ports:
+  #     - "80:80"
+  #   volumes:
+  #     - ./nginx.conf:/etc/nginx/nginx.conf
+  #   depends_on:
+  #     - fluxstack
+  #   restart: unless-stopped
+`
+
+    // .dockerignore otimizado
+    const dockerignore = `node_modules
+.git
+.gitignore
+README.md
+.env.local
+.env.*.local
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+.DS_Store
+*.log
+coverage
+.nyc_output
+.vscode
+.idea
+*.swp
+*.swo
+`
+
+    // Escrever arquivos no dist
+    try {
+      console.log(`📝 Writing Dockerfile...`)
+      writeFileSync(join(distDir, "Dockerfile"), dockerfile)
+      console.log(`📝 Writing docker-compose.yml...`)
+      writeFileSync(join(distDir, "docker-compose.yml"), dockerCompose)
+      console.log(`📝 Writing .dockerignore...`)
+      writeFileSync(join(distDir, ".dockerignore"), dockerignore)
+    } catch (error) {
+      console.error(`❌ Error writing Docker files:`, error)
+      throw error
+    }
+    
+    // Copiar .env ou criar um de exemplo
+    const envPath = join(process.cwd(), '.env')
+    const envExamplePath = join(process.cwd(), '.env.example')
+    const distEnvPath = join(distDir, ".env")
+    
+    console.log(`🔍 Checking for .env files...`)
+    console.log(`  - .env path: ${envPath}`)
+    console.log(`  - .env.example path: ${envExamplePath}`)
+    console.log(`  - target path: ${distEnvPath}`)
+    
+    if (existsSync(envPath)) {
+      console.log(`📄 Copying .env file...`)
+      copyFileSync(envPath, distEnvPath)
+      console.log("📄 Environment file copied to dist/")
+    } else if (existsSync(envExamplePath)) {
+      console.log(`📄 Copying .env.example file...`)
+      copyFileSync(envExamplePath, distEnvPath)
+      console.log("📄 Example environment file copied to dist/")
+    } else {
+      console.log(`📄 Creating default .env file...`)
+      // Criar um .env básico para produção
+      const defaultEnv = `NODE_ENV=production
+PORT=3000
+FLUXSTACK_APP_NAME=fluxstack-app
+FLUXSTACK_APP_VERSION=1.0.0
+LOG_LEVEL=info
+MONITORING_ENABLED=true
+`
+      writeFileSync(distEnvPath, defaultEnv)
+      console.log("📄 Default environment file created for production")
+    }
+    
+    // Copy package.json for Docker build
+    const packageJsonPath = join(process.cwd(), 'package.json')
+    const distPackageJsonPath = join(distDir, 'package.json')
+    
+    console.log(`📦 Copying package.json...`)
+    console.log(`  - source: ${packageJsonPath}`)
+    console.log(`  - target: ${distPackageJsonPath}`)
+    
+    if (existsSync(packageJsonPath)) {
+      copyFileSync(packageJsonPath, distPackageJsonPath)
+      console.log("📦 Package.json copied successfully")
+    } else {
+      console.warn("⚠️ package.json not found, creating minimal version...")
+      const minimalPackageJson = {
+        name: "fluxstack-app",
+        version: "1.0.0",
+        type: "module",
+        scripts: {
+          start: "bun run index.js"
+        },
+        dependencies: {}
+      }
+      writeFileSync(distPackageJsonPath, JSON.stringify(minimalPackageJson, null, 2))
+    }
+    
+    console.log("✅ Docker files created in dist/")
+  }
+
+  async build(): Promise<BuildResult> {
+    console.log("⚡ FluxStack Framework - Building...")
+    
+    const startTime = Date.now()
+    
+    try {
+      // Validate configuration
+      await this.validateConfig()
+      
+      // Clean output directory if requested
+      if (this.config.build.clean) {
+        await this.clean()
+      }
+      
+      // Build client and server
+      const clientResult = await this.buildClient()
+      const serverResult = await this.buildServer()
+      
+      // Check if builds were successful
+      if (!clientResult.success || !serverResult.success) {
+        return {
+          success: false,
+          duration: Date.now() - startTime,
+          error: clientResult.error || serverResult.error || "Build failed",
+          outputFiles: [],
+          warnings: [],
+          errors: [],
+          stats: {
+            totalSize: 0,
+            gzippedSize: 0,
+            chunkCount: 0,
+            assetCount: 0,
+            entryPoints: [],
+            dependencies: []
+          }
+        }
+      }
+      
+      // Optimize build if enabled
+      let optimizationResult
+      if (this.config.build.optimize) {
+        optimizationResult = await this.optimizer.optimize(this.config.build.outDir)
+      }
+      
+      // Create Docker files
+      await this.createDockerFiles()
+      
+      // Generate build manifest
+      const manifest = await this.generateManifest(clientResult, serverResult, optimizationResult)
+      
+      const duration = Date.now() - startTime
+      
+      console.log("🎉 Build completed successfully!")
+      console.log(`⏱️ Build time: ${duration}ms`)
+      console.log("🐳 Ready for Docker deployment from dist/ directory")
+      
+      return {
+        success: true,
+        duration,
+        outputFiles: [],
+        warnings: [],
+        errors: [],
+        stats: {
+          totalSize: optimizationResult?.optimizedSize || 0,
+          gzippedSize: 0,
+          chunkCount: 0,
+          assetCount: clientResult.assets?.length || 0,
+          entryPoints: [serverResult.entryPoint || ""].filter(Boolean),
+          dependencies: []
+        }
+      }
+      
+    } catch (error) {
+      const duration = Date.now() - startTime
+      const errorMessage = error instanceof Error ? error.message : "Unknown build error"
+      
+      console.error("❌ Build failed:", errorMessage)
+      
+      return {
+        success: false,
+        duration,
+        error: errorMessage,
+        outputFiles: [],
+        warnings: [],
+        errors: [],
+        stats: {
+          totalSize: 0,
+          gzippedSize: 0,
+          chunkCount: 0,
+          assetCount: 0,
+          entryPoints: [],
+          dependencies: []
+        }
+      }
+    }
+  }
+
+  private async validateConfig(): Promise<void> {
+    // Validate build configuration
+    if (!this.config.build.outDir) {
+      throw new Error("Build output directory not specified")
+    }
+    
+    if (!this.config.build.target) {
+      throw new Error("Build target not specified")
+    }
+  }
+
+  private async clean(): Promise<void> {
+    // Clean output directory - implementation would go here
+    console.log("🧹 Cleaning output directory...")
+  }
+
+  private async generateManifest(
+    clientResult: any, 
+    serverResult: any, 
+    optimizationResult?: any
+  ): Promise<BuildManifest> {
+    return {
+      version: this.config.app.version,
+      timestamp: new Date().toISOString(),
+      target: this.config.build.target,
+      mode: this.config.build.mode || 'production',
+      client: {
+        entryPoints: [],
+        chunks: [],
+        assets: clientResult.assets || [],
+        publicPath: '/'
+      },
+      server: {
+        entryPoint: serverResult.entryPoint || '',
+        dependencies: [],
+        externals: this.config.build.external || []
+      },
+      assets: [],
+      optimization: {
+        minified: this.config.build.minify,
+        treeshaken: this.config.build.treeshake,
+        compressed: this.config.build.compress || false,
+        originalSize: optimizationResult?.originalSize || 0,
+        optimizedSize: optimizationResult?.optimizedSize || 0,
+        compressionRatio: optimizationResult?.compressionRatio || 0
+      },
+      metrics: {
+        buildTime: clientResult.duration + serverResult.duration,
+        bundleTime: 0,
+        optimizationTime: optimizationResult?.duration || 0,
+        totalSize: optimizationResult?.optimizedSize || 0,
+        gzippedSize: 0,
+        chunkCount: 0,
+        assetCount: clientResult.assets?.length || 0
+      }
+    }
+  }
+}

package/core/build/optimizer.ts

@@ -0,0 +1,268 @@
+import { readFileSync, writeFileSync, statSync, readdirSync } from "fs"
+import { join, extname } from "path"
+import { gzipSync } from "zlib"
+import type { OptimizationConfig, OptimizationResult } from "../types/build"
+
+export interface OptimizerConfig {
+  minify: boolean
+  treeshake: boolean
+  compress: boolean
+  removeUnusedCSS: boolean
+  optimizeImages: boolean
+  bundleAnalysis: boolean
+}
+
+export class Optimizer {
+  private config: OptimizerConfig
+
+  constructor(config: OptimizerConfig) {
+    this.config = config
+  }
+
+  async optimize(buildPath: string): Promise<OptimizationResult> {
+    console.log("🔧 Optimizing build...")
+    
+    const startTime = Date.now()
+    const results: OptimizationResult = {
+      success: true,
+      duration: 0,
+      originalSize: 0,
+      optimizedSize: 0,
+      compressionRatio: 0,
+      optimizations: []
+    }
+
+    try {
+      // Get original size
+      results.originalSize = await this.calculateDirectorySize(buildPath)
+
+      // Apply optimizations
+      if (this.config.minify) {
+        await this.minifyAssets(buildPath, results)
+      }
+
+      if (this.config.compress) {
+        await this.compressAssets(buildPath, results)
+      }
+
+      if (this.config.removeUnusedCSS) {
+        await this.removeUnusedCSS(buildPath, results)
+      }
+
+      if (this.config.optimizeImages) {
+        await this.optimizeImages(buildPath, results)
+      }
+
+      if (this.config.bundleAnalysis) {
+        await this.analyzeBundles(buildPath, results)
+      }
+
+      // Calculate final size and compression ratio
+      results.optimizedSize = await this.calculateDirectorySize(buildPath)
+      results.compressionRatio = results.originalSize > 0 
+        ? ((results.originalSize - results.optimizedSize) / results.originalSize) * 100 
+        : 0
+
+      results.duration = Date.now() - startTime
+
+      console.log(`✅ Optimization completed in ${results.duration}ms`)
+      console.log(`📊 Size reduction: ${results.compressionRatio.toFixed(2)}%`)
+      
+      return results
+
+    } catch (error) {
+      results.success = false
+      results.duration = Date.now() - startTime
+      results.error = error instanceof Error ? error.message : "Unknown optimization error"
+      
+      console.error("❌ Optimization failed:", results.error)
+      return results
+    }
+  }
+
+  private async minifyAssets(buildPath: string, results: OptimizationResult): Promise<void> {
+    console.log("🗜️ Minifying assets...")
+    
+    const files = this.getFilesRecursively(buildPath)
+    let minifiedCount = 0
+
+    for (const file of files) {
+      const ext = extname(file).toLowerCase()
+      
+      if (ext === '.js' || ext === '.css') {
+        try {
+          const content = readFileSync(file, 'utf-8')
+          const minified = await this.minifyContent(content, ext)
+          
+          if (minified !== content) {
+            writeFileSync(file, minified)
+            minifiedCount++
+          }
+        } catch (error) {
+          console.warn(`⚠️ Failed to minify ${file}:`, error)
+        }
+      }
+    }
+
+    results.optimizations.push({
+      type: 'minification',
+      description: `Minified ${minifiedCount} files`,
+      sizeSaved: 0 // Would calculate actual size saved
+    })
+  }
+
+  private async minifyContent(content: string, type: string): Promise<string> {
+    // Basic minification - in a real implementation, you'd use proper minifiers
+    if (type === '.js') {
+      return content
+        .replace(/\/\*[\s\S]*?\*\//g, '') // Remove comments
+        .replace(/\/\/.*$/gm, '') // Remove single-line comments
+        .replace(/\s+/g, ' ') // Collapse whitespace
+        .trim()
+    } else if (type === '.css') {
+      return content
+        .replace(/\/\*[\s\S]*?\*\//g, '') // Remove comments
+        .replace(/\s+/g, ' ') // Collapse whitespace
+        .replace(/;\s*}/g, '}') // Remove unnecessary semicolons
+        .trim()
+    }
+    
+    return content
+  }
+
+  private async compressAssets(buildPath: string, results: OptimizationResult): Promise<void> {
+    console.log("📦 Compressing assets...")
+    
+    const files = this.getFilesRecursively(buildPath)
+    let compressedCount = 0
+
+    for (const file of files) {
+      const ext = extname(file).toLowerCase()
+      
+      if (['.js', '.css', '.html', '.json', '.svg'].includes(ext)) {
+        try {
+          const content = readFileSync(file)
+          const compressed = gzipSync(content)
+          
+          // Only create .gz file if it's significantly smaller
+          if (compressed.length < content.length * 0.9) {
+            writeFileSync(file + '.gz', compressed)
+            compressedCount++
+          }
+        } catch (error) {
+          console.warn(`⚠️ Failed to compress ${file}:`, error)
+        }
+      }
+    }
+
+    results.optimizations.push({
+      type: 'compression',
+      description: `Created gzip versions for ${compressedCount} files`,
+      sizeSaved: 0
+    })
+  }
+
+  private async removeUnusedCSS(buildPath: string, results: OptimizationResult): Promise<void> {
+    console.log("🎨 Removing unused CSS...")
+    
+    // This is a placeholder - real implementation would use PurgeCSS or similar
+    results.optimizations.push({
+      type: 'css-purging',
+      description: 'CSS purging not implemented yet',
+      sizeSaved: 0
+    })
+  }
+
+  private async optimizeImages(buildPath: string, results: OptimizationResult): Promise<void> {
+    console.log("🖼️ Optimizing images...")
+    
+    // This is a placeholder - real implementation would use imagemin or similar
+    results.optimizations.push({
+      type: 'image-optimization',
+      description: 'Image optimization not implemented yet',
+      sizeSaved: 0
+    })
+  }
+
+  private async analyzeBundles(buildPath: string, results: OptimizationResult): Promise<void> {
+    console.log("📊 Analyzing bundles...")
+    
+    const files = this.getFilesRecursively(buildPath)
+    const jsFiles = files.filter(f => extname(f) === '.js')
+    
+    let totalJSSize = 0
+    for (const file of jsFiles) {
+      totalJSSize += statSync(file).size
+    }
+
+    results.optimizations.push({
+      type: 'bundle-analysis',
+      description: `Analyzed ${jsFiles.length} JS bundles (${(totalJSSize / 1024).toFixed(2)} KB total)`,
+      sizeSaved: 0
+    })
+  }
+
+  private async calculateDirectorySize(dirPath: string): Promise<number> {
+    const files = this.getFilesRecursively(dirPath)
+    let totalSize = 0
+    
+    for (const file of files) {
+      try {
+        totalSize += statSync(file).size
+      } catch (error) {
+        // Ignore files that can't be read
+      }
+    }
+    
+    return totalSize
+  }
+
+  private getFilesRecursively(dir: string): string[] {
+    const files: string[] = []
+    
+    try {
+      const items = readdirSync(dir, { withFileTypes: true })
+      
+      for (const item of items) {
+        const fullPath = join(dir, item.name)
+        
+        if (item.isDirectory()) {
+          files.push(...this.getFilesRecursively(fullPath))
+        } else {
+          files.push(fullPath)
+        }
+      }
+    } catch (error) {
+      // Ignore directories that can't be read
+    }
+    
+    return files
+  }
+
+  async createOptimizationReport(result: OptimizationResult): Promise<string> {
+    const report = `
+# Build Optimization Report
+
+## Summary
+- **Status**: ${result.success ? '✅ Success' : '❌ Failed'}
+- **Duration**: ${result.duration}ms
+- **Original Size**: ${(result.originalSize / 1024).toFixed(2)} KB
+- **Optimized Size**: ${(result.optimizedSize / 1024).toFixed(2)} KB
+- **Size Reduction**: ${result.compressionRatio.toFixed(2)}%
+
+## Optimizations Applied
+
+${result.optimizations.map(opt => 
+  `### ${opt.type.charAt(0).toUpperCase() + opt.type.slice(1)}
+- ${opt.description}
+- Size Saved: ${(opt.sizeSaved / 1024).toFixed(2)} KB`
+).join('\n\n')}
+
+${result.error ? `## Error\n${result.error}` : ''}
+
+Generated at: ${new Date().toISOString()}
+`
+
+    return report.trim()
+  }
+}

package/core/templates/create-project.ts

@@ -151,6 +151,8 @@ export class ProjectCreator {
         "@types/bun": "latest",
         "@types/react": "^18.2.0",
         "@types/react-dom": "^18.2.0",
+        "@types/uuid": "^10.0.0",
+        "@types/ws": "^8.18.1",
         "@testing-library/react": "^14.0.0",
         "@testing-library/jest-dom": "^6.1.0",
         "@testing-library/user-event": "^14.5.0",
@@ -164,10 +166,16 @@ export class ProjectCreator {
         "@elysiajs/eden": "^1.3.2",
         "@sinclair/typebox": "^0.34.41",
         "@vitejs/plugin-react": "^4.0.0",
-        elysia: "latest",
-        react: "^18.2.0",
+        "chalk": "^5.3.0",
+        "chokidar": "^4.0.3",
+        "elysia": "latest",
+        "react": "^18.2.0",
         "react-dom": "^18.2.0",
-        vite: "^5.0.0"
+        "react-icons": "^5.5.0",
+        "uuid": "^13.0.0",
+        "vite": "^5.0.0",
+        "ws": "^8.18.3",
+        "zustand": "^5.0.8"
       }
     }
 
@@ -527,44 +535,6 @@ Built with ❤️ using FluxStack framework.
 `
 
     await Bun.write(join(this.targetDir, "README.md"), readme)
-
-    // .gitignore
-    const gitignore = `# Dependencies
-node_modules/
-*.lockb
-
-# Build outputs
-dist/
-build/
-.next/
-
-# Environment variables
-.env.local
-.env.production
-
-# IDE
-.vscode/
-.idea/
-*.swp
-*.swo
-
-# OS
-.DS_Store
-Thumbs.db
-
-# Logs
-*.log
-logs/
-
-# Runtime
-.tmp/
-.cache/
-
-# Bun
-bun.lockb
-`
-
-    await Bun.write(join(this.targetDir, ".gitignore"), gitignore)
   }
 
   private async installDependencies() {

package/eslint.config.js

@@ -0,0 +1,23 @@
+import js from '@eslint/js'
+import globals from 'globals'
+import reactHooks from 'eslint-plugin-react-hooks'
+import reactRefresh from 'eslint-plugin-react-refresh'
+import tseslint from 'typescript-eslint'
+import { globalIgnores } from 'eslint/config'
+
+export default tseslint.config([
+  globalIgnores(['dist']),
+  {
+    files: ['**/*.{ts,tsx}'],
+    extends: [
+      js.configs.recommended,
+      tseslint.configs.recommended,
+      reactHooks.configs['recommended-latest'],
+      reactRefresh.configs.vite,
+    ],
+    languageOptions: {
+      ecmaVersion: 2020,
+      globals: globals.browser,
+    },
+  },
+])

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-fluxstack",
-  "version": "1.0.15",
+  "version": "1.0.18",
   "description": "⚡ Modern full-stack TypeScript framework with Elysia + React + Bun",
   "keywords": [
     "framework",

package/tailwind.config.js

@@ -0,0 +1,34 @@
+/** @type {import('tailwindcss').Config} */
+export default {
+  content: [
+    "./app/client/index.html",
+    "./app/client/src/**/*.{js,ts,jsx,tsx}",
+  ],
+  theme: {
+    extend: {
+      colors: {
+        // Custom colors for FluxStack branding
+        flux: {
+          50: '#f0f9ff',
+          100: '#e0f2fe',
+          200: '#bae6fd',
+          300: '#7dd3fc',
+          400: '#38bdf8',
+          500: '#0ea5e9',
+          600: '#0284c7',
+          700: '#0369a1',
+          800: '#075985',
+          900: '#0c4a6e',
+        }
+      },
+      fontFamily: {
+        sans: ['-apple-system', 'BlinkMacSystemFont', 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'sans-serif'],
+      },
+      animation: {
+        'spin-slow': 'spin 3s linear infinite',
+        'pulse-slow': 'pulse 3s cubic-bezier(0.4, 0, 0.6, 1) infinite',
+      }
+    },
+  },
+  plugins: [],
+}

package/vitest.config.live.ts

@@ -0,0 +1,68 @@
+// 🧪 Vitest Configuration for Live Components Tests
+
+import { defineConfig } from 'vitest/config'
+import path from 'path'
+
+export default defineConfig({
+  test: {
+    name: 'live-components',
+    root: './core/server/live',
+    environment: 'node',
+    setupFiles: ['./__tests__/setup.ts'],
+    include: [
+      '**/__tests__/**/*.test.ts'
+    ],
+    exclude: [
+      '**/node_modules/**',
+      '**/dist/**',
+      '**/.{idea,git,cache,output,temp}/**'
+    ],
+    globals: true,
+    coverage: {
+      provider: 'v8',
+      reporter: ['text', 'json', 'html'],
+      reportsDirectory: './coverage/live-components',
+      include: [
+        'core/server/live/**/*.ts'
+      ],
+      exclude: [
+        'core/server/live/**/__tests__/**',
+        'core/server/live/**/*.test.ts',
+        'core/server/live/**/*.spec.ts'
+      ],
+      thresholds: {
+        global: {
+          branches: 80,
+          functions: 80,
+          lines: 80,
+          statements: 80
+        }
+      }
+    },
+    testTimeout: 10000,
+    hookTimeout: 10000,
+    teardownTimeout: 5000,
+    isolate: true,
+    pool: 'threads',
+    poolOptions: {
+      threads: {
+        singleThread: false,
+        minThreads: 1,
+        maxThreads: 4
+      }
+    },
+    reporter: ['verbose', 'json'],
+    outputFile: {
+      json: './test-results/live-components.json'
+    }
+  },
+  resolve: {
+    alias: {
+      '@': path.resolve(__dirname, './core'),
+      '@tests': path.resolve(__dirname, './core/server/live/__tests__')
+    }
+  },
+  esbuild: {
+    target: 'node18'
+  }
+})

package/vitest.config.ts

@@ -0,0 +1,42 @@
+/// <reference types="vitest" />
+/// <reference types="@testing-library/jest-dom" />
+import { defineConfig } from 'vitest/config'
+import react from '@vitejs/plugin-react'
+import { resolve } from 'path'
+
+export default defineConfig({
+  plugins: [react()],
+  test: {
+    globals: true,
+    environment: 'jsdom',
+    setupFiles: ['./app/client/src/test/setup.ts'],
+    include: [
+      'app/**/*.{test,spec}.{js,mjs,cjs,ts,mts,cts,jsx,tsx}',
+      'core/**/*.{test,spec}.{js,mjs,cjs,ts,mts,cts,jsx,tsx}'
+    ],
+    exclude: [
+      'node_modules',
+      'dist',
+      '.git',
+      '.cache'
+    ],
+    coverage: {
+      provider: 'v8',
+      reporter: ['text', 'json', 'html'],
+      exclude: [
+        'node_modules/',
+        'app/client/src/test/',
+        '**/*.d.ts',
+        '**/*.config.*',
+        '**/coverage/**'
+      ]
+    }
+  },
+  resolve: {
+    alias: {
+      '@': resolve(__dirname, './app/client/src'),
+      '@core': resolve(__dirname, './core'),
+      '@server': resolve(__dirname, './app/server')
+    }
+  }
+})

package/workspace.json

@@ -0,0 +1,6 @@
+{
+  "name": "fluxstack-workspace",
+  "workspaces": [
+    "./packages/*"
+  ]
+}