@iselect/select 1.0.2 → 1.0.4

package/lib/commands/build.js

@@ -101,6 +101,10 @@ const DEPENDENCY_SIGNATURES = {
     'gatsby': { name: 'Gatsby', build: 'npm run build', output: 'public', icon: '💜' },
     '@angular/core': { name: 'Angular', build: 'npm run build', output: 'dist', icon: '🅰️' },
     'react-scripts': { name: 'Create React App', build: 'npm run build', output: 'build', icon: '⚛️' },
+    'vite': { name: 'Vite', build: 'npm run build', output: 'dist', icon: '⚡' },
+    'astro': { name: 'Astro', build: 'npm run build', output: 'dist', icon: '🚀' },
+    'svelte': { name: 'Svelte', build: 'npm run build', output: 'build', icon: '🔶' },
+    'nuxt': { name: 'Nuxt', build: 'npm run build', output: '.nuxt', icon: '💚' },
 };
 
 // ==================== FRAMEWORK DETECTION ====================
@@ -289,6 +293,37 @@ async function buildWeb(config, options) {
     const projectPath = process.cwd();
     const outputDir = path.resolve(projectPath, config.build?.outDir || 'dist');
 
+    // Check if npm install has been run (for projects with package.json)
+    const hasPackageJson = await fs.pathExists(path.join(projectPath, 'package.json'));
+    const hasNodeModules = await fs.pathExists(path.join(projectPath, 'node_modules'));
+
+    if (hasPackageJson && !hasNodeModules) {
+        console.log(chalk.yellow('⚠️  Dependencies not installed'));
+        console.log(chalk.gray('   Run: npm install\n'));
+
+        const answers = await inquirer.prompt([{
+            type: 'confirm',
+            name: 'install',
+            message: 'Run npm install now?',
+            default: true
+        }]);
+
+        if (answers.install) {
+            const spinner = ora('Installing dependencies...').start();
+            try {
+                execSync('npm install', { cwd: projectPath, stdio: 'pipe' });
+                spinner.succeed('Dependencies installed!');
+                console.log('');
+            } catch (error) {
+                spinner.fail('Failed to install dependencies');
+                throw error;
+            }
+        } else {
+            console.log(chalk.gray('   Skipping build.\n'));
+            return;
+        }
+    }
+
     // Check for --static flag
     if (options.static) {
         console.log(chalk.gray('   Mode: Static (--static flag)'));

package/lib/commands/deploy.js

@@ -121,27 +121,107 @@ async function deploy(options) {
 
     // Web App
     if (config.platforms.includes('web')) {
-        const buildDir = path.resolve(process.cwd(), config.build?.outDir || 'dist');
-        if (await fs.pathExists(buildDir)) {
-            const zipPath = path.join(os.tmpdir(), `web-build-${Date.now()}.zip`);
-            const output = fs.createWriteStream(zipPath);
-            const archive = archiver('zip', { zlib: { level: 9 } });
-
-            spinner.text = 'Zipping web build...';
-
-            await new Promise((resolve, reject) => {
-                output.on('close', resolve);
-                archive.on('error', reject);
-                archive.pipe(output);
-                archive.directory(buildDir, false);
-                archive.finalize();
-            });
-
-            form.append('web', fs.createReadStream(zipPath));
-            manifest.platforms.push('web');
-            foundArtifacts++;
+        const isStaticSite = !config.build?.command;
+
+        if (isStaticSite) {
+            // Static site - upload files directly (no zipping)
+            spinner.text = 'Preparing static files for upload...';
+
+            // For static sites, the source IS the dist
+            const sourceDir = process.cwd();
+            const staticFiles = ['index.html', 'style.css', 'app.js', 'script.js', 'main.js'];
+            const staticFolders = ['assets', 'css', 'js', 'images', 'fonts'];
+
+            const filesToUpload = [];
+
+            // Collect individual files
+            for (const file of staticFiles) {
+                const filePath = path.join(sourceDir, file);
+                if (await fs.pathExists(filePath)) {
+                    const content = await fs.readFile(filePath);
+                    const hash = require('crypto').createHash('md5').update(content).digest('hex').slice(0, 8);
+                    filesToUpload.push({ path: file, content, hash });
+                }
+            }
+
+            // Collect files from folders
+            for (const folder of staticFolders) {
+                const folderPath = path.join(sourceDir, folder);
+                if (await fs.pathExists(folderPath)) {
+                    const files = await fs.readdir(folderPath, { recursive: true });
+                    for (const file of files) {
+                        const fullPath = path.join(folderPath, file);
+                        const stat = await fs.stat(fullPath);
+                        if (stat.isFile()) {
+                            const content = await fs.readFile(fullPath);
+                            const hash = require('crypto').createHash('md5').update(content).digest('hex').slice(0, 8);
+                            filesToUpload.push({ path: `${folder}/${file}`, content, hash });
+                        }
+                    }
+                }
+            }
+
+            if (filesToUpload.length === 0) {
+                spinner.warn('No static files found to deploy');
+            } else {
+                spinner.text = `Found ${filesToUpload.length} files to upload...`;
+
+                // Create a manifest of files with hashes
+                manifest.staticFiles = filesToUpload.map(f => ({ path: f.path, hash: f.hash }));
+
+                // For now, still use zip but with the static files only
+                // TODO: Switch to direct R2 upload when backend supports it
+                const zipPath = path.join(os.tmpdir(), `static-build-${Date.now()}.zip`);
+                const output = fs.createWriteStream(zipPath);
+                const archive = archiver('zip', { zlib: { level: 9 } });
+
+                spinner.text = 'Creating deployment package...';
+
+                await new Promise((resolve, reject) => {
+                    output.on('close', resolve);
+                    archive.on('error', reject);
+                    archive.pipe(output);
+                    for (const file of filesToUpload) {
+                        archive.append(file.content, { name: file.path });
+                    }
+                    archive.finalize();
+                });
+
+                form.append('web', fs.createReadStream(zipPath));
+                manifest.platforms.push('web');
+                manifest.deployMode = 'static';
+                foundArtifacts++;
+
+                // Log file hashes for potential future deduplication
+                console.log(chalk.gray(`\n   Files to deploy:`));
+                filesToUpload.forEach(f => {
+                    console.log(chalk.gray(`     ${f.hash} ${f.path}`));
+                });
+            }
         } else {
-            spinner.warn('Web build directory not found (skipping web upload)');
+            // Bundled project - use dist directory
+            const buildDir = path.resolve(process.cwd(), config.build?.outDir || 'dist');
+            if (await fs.pathExists(buildDir)) {
+                const zipPath = path.join(os.tmpdir(), `web-build-${Date.now()}.zip`);
+                const output = fs.createWriteStream(zipPath);
+                const archive = archiver('zip', { zlib: { level: 9 } });
+
+                spinner.text = 'Zipping web build...';
+
+                await new Promise((resolve, reject) => {
+                    output.on('close', resolve);
+                    archive.on('error', reject);
+                    archive.pipe(output);
+                    archive.directory(buildDir, false);
+                    archive.finalize();
+                });
+
+                form.append('web', fs.createReadStream(zipPath));
+                manifest.platforms.push('web');
+                foundArtifacts++;
+            } else {
+                spinner.warn('Web build directory not found (skipping web upload)');
+            }
         }
     } else if (foundArtifacts === 0) { // Only error if NO artifacts found and web not requested
         spinner.fail('No build artifacts found!');

package/lib/commands/init.js

@@ -41,7 +41,8 @@ async function init(name, options) {
       choices: [
         { name: 'React + Vite', value: 'react' },
         { name: 'Vue + Vite', value: 'vue' },
-        { name: 'Vanilla JavaScript', value: 'vanilla' }
+        { name: 'Vanilla + Vite', value: 'vanilla' },
+        { name: 'Pure Static (no bundler)', value: 'static' }
       ],
       default: options.template
     },
@@ -82,86 +83,76 @@ async function init(name, options) {
       platforms: answers.platforms,
       desktop: {
         framework: answers.desktopFramework || 'tauri'
-      },
-      build: {
+      }
+    };
+
+    // Add build config only for non-static templates
+    if (answers.template !== 'static') {
+      selectConfig.build = {
         command: 'npm run build',
         devCommand: 'npm run dev',
         outDir: 'dist'
-      }
-    };
+      };
+    }
 
     await fs.writeJson(path.join(projectDir, 'select.json'), selectConfig, { spaces: 2 });
 
-    // Create basic package.json
-    const packageJson = {
-      name: name,
-      version: '1.0.0',
-      private: true,
-      scripts: {
-        dev: 'vite',
-        build: 'vite build',
-        preview: 'vite preview',
-        'slct:build': 'slct build all',
-        'slct:deploy': 'slct deploy'
-      },
-      dependencies: {},
-      devDependencies: {
-        'vite': '^5.0.0'
+    // Only create package.json for bundled templates (not static)
+    if (answers.template !== 'static') {
+      const packageJson = {
+        name: name,
+        version: '1.0.0',
+        private: true,
+        scripts: {
+          dev: 'vite',
+          build: 'vite build',
+          preview: 'vite preview',
+          'slct:build': 'slct build all',
+          'slct:deploy': 'slct deploy'
+        },
+        dependencies: {},
+        devDependencies: {
+          'vite': '^5.0.0'
+        }
+      };
+
+      // Add template-specific dependencies
+      if (answers.template === 'react') {
+        packageJson.dependencies['react'] = '^18.2.0';
+        packageJson.dependencies['react-dom'] = '^18.2.0';
+        packageJson.devDependencies['@vitejs/plugin-react'] = '^4.2.0';
+      } else if (answers.template === 'vue') {
+        packageJson.dependencies['vue'] = '^3.4.0';
+        packageJson.devDependencies['@vitejs/plugin-vue'] = '^4.5.0';
       }
-    };
 
-    // Add template-specific dependencies
-    if (answers.template === 'react') {
-      packageJson.dependencies['react'] = '^18.2.0';
-      packageJson.dependencies['react-dom'] = '^18.2.0';
-      packageJson.devDependencies['@vitejs/plugin-react'] = '^4.2.0';
-    } else if (answers.template === 'vue') {
-      packageJson.dependencies['vue'] = '^3.4.0';
-      packageJson.devDependencies['@vitejs/plugin-vue'] = '^4.5.0';
+      await fs.writeJson(path.join(projectDir, 'package.json'), packageJson, { spaces: 2 });
     }
 
-    await fs.writeJson(path.join(projectDir, 'package.json'), packageJson, { spaces: 2 });
-
-    // Create basic index.html
-    const indexHtml = `<!DOCTYPE html>
+    // Handle template-specific file generation
+    if (answers.template === 'static') {
+      // Pure static template - no bundler, files in root
+      await fs.writeFile(path.join(projectDir, 'index.html'), `<!DOCTYPE html>
 <html lang="en">
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>${name}</title>
+    <link rel="stylesheet" href="style.css">
 </head>
 <body>
-    <div id="app"></div>
-    <script type="module" src="/src/main.${answers.template === 'vanilla' ? 'js' : answers.template === 'react' ? 'jsx' : 'js'}"></script>
-</body>
-</html>`;
-
-    await fs.writeFile(path.join(projectDir, 'index.html'), indexHtml);
-
-    // Create src directory with basic file
-    await fs.ensureDir(path.join(projectDir, 'src'));
-
-    // Create GitHub Actions workflow
-    await createGithubWorkflow(projectDir, answers.desktopFramework || 'tauri', name);
-
-    if (answers.template === 'react') {
-      await fs.writeFile(path.join(projectDir, 'src', 'main.jsx'), `import React from 'react'
-import ReactDOM from 'react-dom/client'
-import './style.css'
-
-function App() {
-    return (
-        <div className="app">
+    <div id="app">
+        <div class="container">
             <h1>Welcome to ${name}</h1>
             <p>Built with Select CLI</p>
+            <button id="counter-btn">Count: 0</button>
         </div>
-    )
-}
+    </div>
+    <script src="app.js"></script>
+</body>
+</html>`);
 
-ReactDOM.createRoot(document.getElementById('app')).render(<App />)
-`);
-      // Create React style.css
-      await fs.writeFile(path.join(projectDir, 'src', 'style.css'), `* {
+      await fs.writeFile(path.join(projectDir, 'style.css'), `* {
     margin: 0;
     padding: 0;
     box-sizing: border-box;
@@ -176,7 +167,7 @@ body {
     justify-content: center;
 }
 
-.app {
+.container {
     background: white;
     padding: 3rem 4rem;
     border-radius: 1rem;
@@ -191,11 +182,75 @@ h1 {
 
 p {
     color: #718096;
+    margin-bottom: 1.5rem;
+}
+
+button {
+    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+    color: white;
+    border: none;
+    padding: 0.75rem 2rem;
+    font-size: 1rem;
+    border-radius: 0.5rem;
+    cursor: pointer;
+    transition: transform 0.2s, box-shadow 0.2s;
 }
+
+button:hover {
+    transform: translateY(-2px);
+    box-shadow: 0 10px 20px rgba(102, 126, 234, 0.4);
+}
+`);
+
+      await fs.writeFile(path.join(projectDir, 'app.js'), `// Simple counter example
+let count = 0;
+const button = document.getElementById('counter-btn');
+
+button.addEventListener('click', () => {
+    count++;
+    button.textContent = 'Count: ' + count;
+});
+
+console.log('${name} loaded!');
 `);
+
     } else {
-      // Vanilla JS template
-      await fs.writeFile(path.join(projectDir, 'src', 'main.js'), `import './style.css'
+      // Vite-based templates (react, vue, vanilla)
+      const indexHtml = `<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>${name}</title>
+</head>
+<body>
+    <div id="app"></div>
+    <script type="module" src="/src/main.${answers.template === 'react' ? 'jsx' : 'js'}"></script>
+</body>
+</html>`;
+
+      await fs.writeFile(path.join(projectDir, 'index.html'), indexHtml);
+      await fs.ensureDir(path.join(projectDir, 'src'));
+
+      if (answers.template === 'react') {
+        await fs.writeFile(path.join(projectDir, 'src', 'main.jsx'), `import React from 'react'
+import ReactDOM from 'react-dom/client'
+import './style.css'
+
+function App() {
+    return (
+        <div className="app">
+            <h1>Welcome to ${name}</h1>
+            <p>Built with Select CLI</p>
+        </div>
+    )
+}
+
+ReactDOM.createRoot(document.getElementById('app')).render(<App />)
+`);
+      } else {
+        // Vanilla JS template
+        await fs.writeFile(path.join(projectDir, 'src', 'main.js'), `import './style.css'
 
 document.getElementById('app').innerHTML = \`
     <div class="app">
@@ -204,7 +259,9 @@ document.getElementById('app').innerHTML = \`
     </div>
 \`
 `);
-      // Create style.css for vanilla
+      }
+
+      // Create style.css for Vite templates
       await fs.writeFile(path.join(projectDir, 'src', 'style.css'), `* {
     margin: 0;
     padding: 0;
@@ -239,9 +296,26 @@ p {
 `);
     }
 
+    // Create GitHub Actions workflow (only for non-static with desktop targets)
+    if (answers.template !== 'static' && answers.platforms.some(p => ['windows', 'macos', 'linux'].includes(p))) {
+      await createGithubWorkflow(projectDir, answers.desktopFramework || 'tauri', name);
+    }
+
     spinner.succeed('Project created successfully!');
 
-    console.log(chalk.green(`
+    // Different next steps for static vs bundled
+    if (answers.template === 'static') {
+      console.log(chalk.green(`
+✅ Project "${name}" created!
+
+Next steps:
+  ${chalk.cyan(`cd ${name}`)}
+  ${chalk.cyan('slct deploy')}
+
+No npm install needed - it's pure HTML/CSS/JS!
+`));
+    } else {
+      console.log(chalk.green(`
 ✅ Project "${name}" created!
 
 Next steps:
@@ -250,6 +324,7 @@ Next steps:
   ${chalk.cyan('slct build')}
 
 `));
+    }
 
     // Check for required dependencies
     await checkDependencies(answers);

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@iselect/select",
-    "version": "1.0.2",
+    "version": "1.0.4",
     "description": "Build and deploy apps for web, desktop, and mobile from a single codebase",
     "main": "lib/index.js",
     "bin": {