uniweb 0.7.5 → 0.7.7

package/README.md

@@ -7,59 +7,54 @@ Create well-structured Vite + React projects with file-based routing, localizati
 ## Quick Start
 
 ```bash
-pnpm create uniweb my-site --template marketing
-cd my-site
-pnpm install
-pnpm dev
+npm create uniweb
 ```
 
-Open http://localhost:5173 to see your site. Edit files in `site/pages/` and `foundation/src/sections/` to see changes instantly.
-
-> **Need pnpm?** Run `npm install -g pnpm` or see [pnpm installation](https://pnpm.io/installation).
+> **pnpm ready** — `pnpm create uniweb` works out of the box. Projects include both `pnpm-workspace.yaml` and npm workspaces.
 
-### Development Commands
-
-Run these from the **project root** (where `pnpm-workspace.yaml` is):
+The interactive prompt asks for a project name and template. Pick one, then:
 
 ```bash
-pnpm dev        # Start development server
-pnpm build      # Build foundation + site for production
-pnpm preview    # Preview the production build
+cd my-project
+npm install
+npm run dev
 ```
 
-The `build` command outputs to `site/dist/`. With pre-rendering enabled (the default for official templates), you get static HTML files ready to deploy anywhere.
-
-The `marketing` template includes real components (Hero, Features, Pricing, Testimonials, FAQ, and more) with sample content—a working site you can explore and modify.
-
-**Other templates:**
+Edit files in `site/pages/` and `foundation/src/sections/` to see changes instantly.
 
-```bash
-# Multilingual business site (English, Spanish, French)
-pnpm create uniweb my-site --template international
+### Templates
 
-# Academic site (researcher portfolios, lab pages)
-pnpm create uniweb my-site --template academic
+| Template | Description |
+| --- | --- |
+| **Starter** | Foundation + site + sample content (default) |
+| **Marketing** | Landing page, features, pricing, testimonials |
+| **Docs** | Documentation with sidebar and search |
+| **Academic** | Research site with publications and team |
+| **International** | Multilingual site with i18n and blog |
+| **Dynamic** | Live API data fetching with loading states |
+| **Store** | E-commerce with product grid |
+| **Extensions** | Multi-foundation with visual effects extension |
+| **Blank** | Empty workspace — grow with `uniweb add` |
 
-# Documentation site
-pnpm create uniweb my-site --template docs
+**See them live:** [View all template demos](https://uniweb.github.io/templates/)
 
-# Online store
-pnpm create uniweb my-site --template store
+You can also skip the interactive prompt with `--template`:
 
-# Dynamic content (data sources, API-driven pages)
-pnpm create uniweb my-site --template dynamic
+```bash
+npm create uniweb my-site -- --template docs
+```
 
-# Extensions demo (primary foundation + effects extension)
-pnpm create uniweb my-site --template extensions
+### Development Commands
 
-# Default starter (foundation + site + sample content)
-pnpm create uniweb my-site --template starter
+Run these from the **project root**:
 
-# Blank workspace (grow with `add`)
-pnpm create uniweb my-site --template blank
+```bash
+npm run dev        # Start development server
+npm run build      # Build foundation + site for production
+npm run preview    # Preview the production build
 ```
 
-**See them live:** [View all template demos](https://uniweb.github.io/templates/)
+The `build` command outputs to `site/dist/`. With pre-rendering enabled (the default for official templates), you get static HTML files ready to deploy anywhere.
 
 ## What You Get
 
@@ -173,7 +168,7 @@ After creating your project:
 
 1. **Explore the structure** — Browse `site/pages/` to see how content is organized. Each page folder contains `page.yml` (metadata) and `.md` files (sections).
 
-2. **Generate component docs** — Run `pnpm uniweb docs` to create `COMPONENTS.md` with all available components, their parameters, and presets.
+2. **Generate component docs** — Run `npx uniweb docs` to create `COMPONENTS.md` with all available components, their parameters, and presets.
 
 3. **Learn the configuration** — Run `uniweb docs site` or `uniweb docs page` for quick reference on configuration options.
 
@@ -221,7 +216,7 @@ The `foundation/` folder ships with your project as a convenience, but a foundat
 | Mode             | How it works                       | Best for                                           |
 | ---------------- | ---------------------------------- | -------------------------------------------------- |
 | **Local folder** | Foundation lives in your workspace | Developing site and components together            |
-| **npm package**  | `pnpm add @acme/foundation`        | Distributing via standard package tooling          |
+| **npm package**  | `npm add @acme/foundation`         | Distributing via standard package tooling          |
 | **Runtime link** | Foundation loads from a URL        | Independent release cycles, platform-managed sites |
 
 You can delete the `foundation/` folder entirely and point your site at a published foundation. Or develop a foundation locally, then publish it for other sites to consume. The site doesn't care where its components come from.
@@ -258,11 +253,13 @@ The workspace grows organically. `add` handles placement, wires dependencies, up
 **Or start blank and build up:**
 
 ```bash
-pnpm create uniweb acme --template blank
+npm create uniweb acme -- --template blank
 cd acme
+npm install
 npx uniweb add foundation
 npx uniweb add site
-pnpm install && pnpm dev
+npm install
+npm run dev
 ```
 
 ## The Bigger Picture
@@ -352,7 +349,7 @@ export default defineFoundationConfig({
 
 ### Workspace Configuration
 
-A default project has two packages:
+A default project has two packages, listed in both `pnpm-workspace.yaml` and `package.json`:
 
 ```yaml
 # pnpm-workspace.yaml
@@ -361,7 +358,14 @@ packages:
   - site
 ```
 
-When you `add` more packages, the CLI adds the appropriate globs automatically:
+```json
+// package.json (for npm compatibility)
+{
+  "workspaces": ["foundation", "site"]
+}
+```
+
+When you `add` more packages, the CLI adds the appropriate globs to both files automatically:
 
 ```yaml
 # After: uniweb add foundation blog → adds foundations/*
@@ -373,8 +377,6 @@ packages:
   - extensions/*
 ```
 
-The `package.json` `workspaces` field is kept in sync for npm compatibility.
-
 ## FAQ
 
 **How is this different from MDX?**

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "uniweb",
-  "version": "0.7.5",
+  "version": "0.7.7",
   "description": "Create structured Vite + React sites with content/code separation",
   "type": "module",
   "bin": {
@@ -41,9 +41,9 @@
     "js-yaml": "^4.1.0",
     "prompts": "^2.4.2",
     "tar": "^7.0.0",
-    "@uniweb/build": "0.7.3",
-    "@uniweb/runtime": "0.6.0",
-    "@uniweb/core": "0.5.0",
-    "@uniweb/kit": "0.6.0"
+    "@uniweb/kit": "0.6.1",
+    "@uniweb/build": "0.7.5",
+    "@uniweb/runtime": "0.6.1",
+    "@uniweb/core": "0.5.1"
   }
 }

package/src/commands/add.js

@@ -23,6 +23,7 @@ import {
   updateRootScripts,
 } from '../utils/config.js'
 import { findWorkspaceRoot } from '../utils/workspace.js'
+import { detectPackageManager, filterCmd, installCmd } from '../utils/pm.js'
 import { resolveTemplate } from '../templates/index.js'
 import { validateTemplate } from '../templates/validator.js'
 import { getVersionsForTemplates } from '../versions.js'
@@ -90,12 +91,12 @@ function parseArgs(args) {
  * Main add command handler
  */
 export async function add(args) {
-  if (!args.length || args[0] === '--help' || args[0] === '-h') {
+  if (args[0] === '--help' || args[0] === '-h') {
     showAddHelp()
     return
   }
 
-  const parsed = parseArgs(args)
+  const pm = detectPackageManager()
 
   // Find workspace root
   const rootDir = findWorkspaceRoot()
@@ -105,6 +106,29 @@ export async function add(args) {
     process.exit(1)
   }
 
+  // Interactive subcommand chooser when no args given
+  let parsed
+  if (!args.length || (args[0] && args[0].startsWith('--'))) {
+    const response = await prompts({
+      type: 'select',
+      name: 'subcommand',
+      message: 'What would you like to add?',
+      choices: [
+        { title: 'Foundation', value: 'foundation', description: 'Component library' },
+        { title: 'Site', value: 'site', description: 'Content site' },
+        { title: 'Extension', value: 'extension', description: 'Additional component package' },
+      ],
+    }, {
+      onCancel: () => {
+        log('\nCancelled.')
+        process.exit(0)
+      },
+    })
+    parsed = parseArgs([response.subcommand, ...args])
+  } else {
+    parsed = parseArgs(args)
+  }
+
   // Read root package.json for project name
   const rootPkg = JSON.parse(
     await readFile(join(rootDir, 'package.json'), 'utf-8').catch(() => '{}')
@@ -113,13 +137,13 @@ export async function add(args) {
 
   switch (parsed.subcommand) {
     case 'foundation':
-      await addFoundation(rootDir, projectName, parsed)
+      await addFoundation(rootDir, projectName, parsed, pm)
       break
     case 'site':
-      await addSite(rootDir, projectName, parsed)
+      await addSite(rootDir, projectName, parsed, pm)
       break
     case 'extension':
-      await addExtension(rootDir, projectName, parsed)
+      await addExtension(rootDir, projectName, parsed, pm)
       break
     default:
       error(`Unknown subcommand: ${parsed.subcommand}`)
@@ -131,8 +155,32 @@ export async function add(args) {
 /**
  * Add a foundation to the workspace
  */
-async function addFoundation(rootDir, projectName, opts) {
-  const name = opts.name
+async function addFoundation(rootDir, projectName, opts, pm = 'pnpm') {
+  let name = opts.name
+
+  // Interactive name prompt when name not provided and no --path
+  if (!name && !opts.path) {
+    const foundations = await discoverFoundations(rootDir)
+    const hasDefault = foundations.length === 0 && !existsSync(join(rootDir, 'foundation'))
+    const response = await prompts({
+      type: 'text',
+      name: 'name',
+      message: 'Foundation name:',
+      initial: hasDefault ? 'foundation' : undefined,
+      validate: (value) => {
+        if (!value) return 'Name is required'
+        if (!/^[a-z0-9-]+$/.test(value)) return 'Use lowercase letters, numbers, and hyphens'
+        return true
+      },
+    }, {
+      onCancel: () => {
+        log('\nCancelled.')
+        process.exit(0)
+      },
+    })
+    name = response.name
+  }
+
   const target = await resolveFoundationTarget(rootDir, name, opts)
   const fullPath = join(rootDir, target)
 
@@ -161,18 +209,42 @@ async function addFoundation(rootDir, projectName, opts) {
 
   // Update root scripts
   const sites = await discoverSites(rootDir)
-  await updateRootScripts(rootDir, sites)
+  await updateRootScripts(rootDir, sites, pm)
 
   success(`Created foundation '${name || 'foundation'}' at ${target}/`)
   log('')
-  log(`Next: ${colors.cyan}pnpm install${colors.reset}`)
+  log(`Next: ${colors.cyan}${installCmd(pm)}${colors.reset}`)
 }
 
 /**
  * Add a site to the workspace
  */
-async function addSite(rootDir, projectName, opts) {
-  const name = opts.name
+async function addSite(rootDir, projectName, opts, pm = 'pnpm') {
+  let name = opts.name
+
+  // Interactive name prompt when name not provided and no --path
+  if (!name && !opts.path) {
+    const existingSites = await discoverSites(rootDir)
+    const hasDefault = existingSites.length === 0 && !existsSync(join(rootDir, 'site'))
+    const response = await prompts({
+      type: 'text',
+      name: 'name',
+      message: 'Site name:',
+      initial: hasDefault ? 'site' : undefined,
+      validate: (value) => {
+        if (!value) return 'Name is required'
+        if (!/^[a-z0-9-]+$/.test(value)) return 'Use lowercase letters, numbers, and hyphens'
+        return true
+      },
+    }, {
+      onCancel: () => {
+        log('\nCancelled.')
+        process.exit(0)
+      },
+    })
+    name = response.name
+  }
+
   const target = await resolveSiteTarget(rootDir, name, opts)
   const fullPath = join(rootDir, target)
 
@@ -183,25 +255,34 @@ async function addSite(rootDir, projectName, opts) {
 
   // Resolve foundation
   const foundation = await resolveFoundation(rootDir, opts.foundation)
-  if (!foundation) {
-    error('No foundation found. Add a foundation first: uniweb add foundation')
-    process.exit(1)
-  }
-
-  // Compute relative path from site to foundation
-  const foundationPath = computeFoundationPath(target, foundation.path)
   const siteName = name || 'site'
 
-  // Scaffold
-  await scaffoldSite(fullPath, {
-    name: siteName,
-    projectName,
-    foundationName: foundation.name,
-    foundationPath,
-    foundationRef: foundation.name,
-  }, {
-    onProgress: (msg) => info(`  ${msg}`),
-  })
+  if (foundation) {
+    // Compute relative path from site to foundation
+    const foundationPath = computeFoundationPath(target, foundation.path)
+
+    // Scaffold
+    await scaffoldSite(fullPath, {
+      name: siteName,
+      projectName,
+      foundationName: foundation.name,
+      foundationPath,
+      foundationRef: foundation.name,
+    }, {
+      onProgress: (msg) => info(`  ${msg}`),
+    })
+  } else {
+    // No foundation — scaffold without wiring
+    await scaffoldSite(fullPath, {
+      name: siteName,
+      projectName,
+      foundationName: '',
+      foundationPath: '',
+    }, {
+      onProgress: (msg) => info(`  ${msg}`),
+    })
+    log(`  ${colors.yellow}⚠ No foundation wired. Add one later with: npx uniweb add foundation${colors.reset}`)
+  }
 
   // Apply template content if --from specified
   if (opts.from) {
@@ -218,22 +299,41 @@ async function addSite(rootDir, projectName, opts) {
   if (!sites.find(s => s.path === target)) {
     sites.push({ name: siteName, path: target })
   }
-  await updateRootScripts(rootDir, sites)
+  await updateRootScripts(rootDir, sites, pm)
 
-  success(`Created site '${siteName}' at ${target}/ → foundation '${foundation.name}'`)
+  if (foundation) {
+    success(`Created site '${siteName}' at ${target}/ → foundation '${foundation.name}'`)
+  } else {
+    success(`Created site '${siteName}' at ${target}/`)
+  }
   log('')
-  log(`Next: ${colors.cyan}pnpm install && pnpm --filter ${siteName} dev${colors.reset}`)
+  log(`Next: ${colors.cyan}${installCmd(pm)} && ${filterCmd(pm, siteName, 'dev')}${colors.reset}`)
 }
 
 /**
  * Add an extension to the workspace
  */
-async function addExtension(rootDir, projectName, opts) {
-  const name = opts.name
+async function addExtension(rootDir, projectName, opts, pm = 'pnpm') {
+  let name = opts.name
 
+  // Interactive name prompt when name not provided
   if (!name) {
-    error('Extension name is required: uniweb add extension <name>')
-    process.exit(1)
+    const response = await prompts({
+      type: 'text',
+      name: 'name',
+      message: 'Extension name:',
+      validate: (value) => {
+        if (!value) return 'Name is required'
+        if (!/^[a-z0-9-]+$/.test(value)) return 'Use lowercase letters, numbers, and hyphens'
+        return true
+      },
+    }, {
+      onCancel: () => {
+        log('\nCancelled.')
+        process.exit(0)
+      },
+    })
+    name = response.name
   }
 
   // Determine target
@@ -281,7 +381,7 @@ async function addExtension(rootDir, projectName, opts) {
 
   // Update root scripts
   const sites = await discoverSites(rootDir)
-  await updateRootScripts(rootDir, sites)
+  await updateRootScripts(rootDir, sites, pm)
 
   let msg = `Created extension '${name}' at ${target}/`
   if (wiredSite) {
@@ -289,7 +389,7 @@ async function addExtension(rootDir, projectName, opts) {
   }
   success(msg)
   log('')
-  log(`Next: ${colors.cyan}pnpm install${colors.reset}`)
+  log(`Next: ${colors.cyan}${installCmd(pm)}${colors.reset}`)
 }
 
 /**
@@ -367,6 +467,19 @@ async function resolveFoundation(rootDir, foundationFlag) {
   }
 
   if (foundations.length === 0) {
+    const response = await prompts({
+      type: 'select',
+      name: 'choice',
+      message: 'No foundations found. Proceed without one?',
+      choices: [
+        { title: 'None', value: 'none', description: 'Proceed without a foundation' },
+      ],
+    }, {
+      onCancel: () => {
+        log('\nCancelled.')
+        process.exit(0)
+      },
+    })
     return null
   }
 

package/src/commands/doctor.js

@@ -379,7 +379,7 @@ export async function doctor(args = []) {
         message: `Foundation not built: ${matchingFoundation.name}`
       })
       warn(`Foundation not built yet`)
-      log(`  ${colors.dim}Run: pnpm --filter ${matchingFoundation.name} build${colors.reset}`)
+      log(`  ${colors.dim}Run: npx uniweb build${colors.reset}`)
     } else {
       success(`Foundation built: dist/foundation.js exists`)
     }
@@ -431,7 +431,7 @@ export async function doctor(args = []) {
         message: `Extension not built: ${ext.name}`
       })
       warn(`Extension not built yet`)
-      log(`  ${colors.dim}Run: pnpm --filter ${ext.name} build${colors.reset}`)
+      log(`  ${colors.dim}Run: npx uniweb build${colors.reset}`)
     } else {
       success(`Extension built: dist/foundation.js exists`)
     }

package/src/index.js

@@ -28,6 +28,7 @@ import {
 } from './templates/index.js'
 import { validateTemplate } from './templates/validator.js'
 import { scaffoldWorkspace, scaffoldFoundation, scaffoldSite, applyContent, applyStarter, mergeTemplateDependencies } from './utils/scaffold.js'
+import { detectPackageManager, filterCmd, installCmd, runCmd } from './utils/pm.js'
 
 // Colors for terminal output
 const colors = {
@@ -73,7 +74,7 @@ function title(message) {
  * Create a project using the new package template flow (default)
  */
 async function createFromPackageTemplates(projectDir, projectName, options = {}) {
-  const { onProgress, onWarning } = options
+  const { onProgress, onWarning, pm = 'pnpm' } = options
 
   onProgress?.('Setting up workspace...')
 
@@ -82,9 +83,9 @@ async function createFromPackageTemplates(projectDir, projectName, options = {})
     projectName,
     workspaceGlobs: ['foundation', 'site'],
     scripts: {
-      dev: 'pnpm --filter site dev',
+      dev: filterCmd(pm, 'site', 'dev'),
       build: 'uniweb build',
-      preview: 'pnpm --filter site preview',
+      preview: filterCmd(pm, 'site', 'preview'),
     },
   }, { onProgress, onWarning })
 
@@ -138,7 +139,7 @@ async function createBlankWorkspace(projectDir, projectName, options = {}) {
  * content (sections, pages, theme) from the content template.
  */
 async function createFromContentTemplate(projectDir, projectName, metadata, templateRootPath, options = {}) {
-  const { onProgress, onWarning } = options
+  const { onProgress, onWarning, pm = 'pnpm' } = options
 
   // Determine packages to create
   const packages = metadata.packages || [
@@ -156,17 +157,17 @@ async function createFromContentTemplate(projectDir, projectName, metadata, temp
     build: 'uniweb build',
   }
   if (sites.length === 1) {
-    scripts.dev = `pnpm --filter ${sites[0].name} dev`
-    scripts.preview = `pnpm --filter ${sites[0].name} preview`
+    scripts.dev = filterCmd(pm, sites[0].name, 'dev')
+    scripts.preview = filterCmd(pm, sites[0].name, 'preview')
   } else {
     for (const s of sites) {
-      scripts[`dev:${s.name}`] = `pnpm --filter ${s.name} dev`
-      scripts[`preview:${s.name}`] = `pnpm --filter ${s.name} preview`
+      scripts[`dev:${s.name}`] = filterCmd(pm, s.name, 'dev')
+      scripts[`preview:${s.name}`] = filterCmd(pm, s.name, 'preview')
     }
     // First site gets unqualified aliases
     if (sites.length > 0) {
-      scripts.dev = `pnpm --filter ${sites[0].name} dev`
-      scripts.preview = `pnpm --filter ${sites[0].name} preview`
+      scripts.dev = filterCmd(pm, sites[0].name, 'dev')
+      scripts.preview = filterCmd(pm, sites[0].name, 'preview')
     }
   }
 
@@ -289,6 +290,7 @@ function computeFoundationFilePath(sitePath, foundationPath) {
 async function main() {
   const args = process.argv.slice(2)
   const command = args[0]
+  const pm = detectPackageManager()
 
   // Show help
   if (!command || command === '--help' || command === '-h') {
@@ -439,6 +441,7 @@ async function main() {
     await createFromPackageTemplates(projectDir, effectiveName, {
       onProgress: progressCb,
       onWarning: warningCb,
+      pm,
     })
   } else {
     // External: official/npm/github/local
@@ -458,6 +461,7 @@ async function main() {
         await createFromContentTemplate(projectDir, effectiveName, metadata, resolved.path, {
           onProgress: progressCb,
           onWarning: warningCb,
+          pm,
         })
       } finally {
         if (resolved.cleanup) await resolved.cleanup()
@@ -497,15 +501,16 @@ async function main() {
   if (templateType === 'blank') {
     log(`Next steps:\n`)
     log(`  ${colors.cyan}cd ${projectName}${colors.reset}`)
+    log(`  ${colors.cyan}${installCmd(pm)}${colors.reset}`)
     log(`  ${colors.cyan}npx uniweb add foundation${colors.reset}`)
     log(`  ${colors.cyan}npx uniweb add site${colors.reset}`)
-    log(`  ${colors.cyan}pnpm install${colors.reset}`)
-    log(`  ${colors.cyan}pnpm dev${colors.reset}`)
+    log(`  ${colors.cyan}${installCmd(pm)}${colors.reset}`)
+    log(`  ${colors.cyan}${runCmd(pm, 'dev')}${colors.reset}`)
   } else {
     log(`Next steps:\n`)
     log(`  ${colors.cyan}cd ${projectName}${colors.reset}`)
-    log(`  ${colors.cyan}pnpm install${colors.reset}`)
-    log(`  ${colors.cyan}pnpm dev${colors.reset}`)
+    log(`  ${colors.cyan}${installCmd(pm)}${colors.reset}`)
+    log(`  ${colors.cyan}${runCmd(pm, 'dev')}${colors.reset}`)
   }
   log('')
 }

package/src/utils/config.js

@@ -9,20 +9,30 @@ import { existsSync } from 'node:fs'
 import { readFile, writeFile } from 'node:fs/promises'
 import { join } from 'node:path'
 import yaml from 'js-yaml'
+import { filterCmd } from './pm.js'
 
 /**
- * Read pnpm-workspace.yaml
+ * Read workspace package globs.
+ * Tries pnpm-workspace.yaml first, falls back to package.json workspaces.
  * @param {string} rootDir - Workspace root directory
  * @returns {Promise<{packages: string[]}>}
  */
 export async function readWorkspaceConfig(rootDir) {
+  // Try pnpm-workspace.yaml first
   const configPath = join(rootDir, 'pnpm-workspace.yaml')
-  if (!existsSync(configPath)) {
-    return { packages: [] }
+  if (existsSync(configPath)) {
+    const content = await readFile(configPath, 'utf-8')
+    const config = yaml.load(content)
+    return { packages: config?.packages || [] }
   }
-  const content = await readFile(configPath, 'utf-8')
-  const config = yaml.load(content)
-  return { packages: config?.packages || [] }
+
+  // Fall back to package.json workspaces
+  const pkg = await readRootPackageJson(rootDir)
+  if (Array.isArray(pkg.workspaces)) {
+    return { packages: pkg.workspaces }
+  }
+
+  return { packages: [] }
 }
 
 /**
@@ -47,6 +57,15 @@ export async function addWorkspaceGlob(rootDir, glob) {
     config.packages.push(glob)
     await writeWorkspaceConfig(rootDir, config)
   }
+
+  // Sync workspaces array in package.json (for npm compatibility)
+  const pkg = await readRootPackageJson(rootDir)
+  if (pkg.workspaces) {
+    if (!pkg.workspaces.includes(glob)) {
+      pkg.workspaces.push(glob)
+      await writeRootPackageJson(rootDir, pkg)
+    }
+  }
 }
 
 /**
@@ -75,9 +94,10 @@ export async function writeRootPackageJson(rootDir, pkg) {
 /**
  * Compute root scripts based on discovered sites
  * @param {Array<{name: string, path: string}>} sites - Discovered sites
+ * @param {'pnpm' | 'npm'} [pm='pnpm'] - Package manager
  * @returns {Object} Scripts object for package.json
  */
-export function computeRootScripts(sites) {
+export function computeRootScripts(sites, pm = 'pnpm') {
   const scripts = {
     build: 'uniweb build',
   }
@@ -87,17 +107,17 @@ export function computeRootScripts(sites) {
   }
 
   if (sites.length === 1) {
-    scripts.dev = `pnpm --filter ${sites[0].name} dev`
-    scripts.preview = `pnpm --filter ${sites[0].name} preview`
+    scripts.dev = filterCmd(pm, sites[0].name, 'dev')
+    scripts.preview = filterCmd(pm, sites[0].name, 'preview')
   } else {
     // First site gets unqualified dev/preview
-    scripts.dev = `pnpm --filter ${sites[0].name} dev`
-    scripts.preview = `pnpm --filter ${sites[0].name} preview`
+    scripts.dev = filterCmd(pm, sites[0].name, 'dev')
+    scripts.preview = filterCmd(pm, sites[0].name, 'preview')
 
     // Subsequent sites get qualified dev:{name}/preview:{name}
     for (let i = 1; i < sites.length; i++) {
-      scripts[`dev:${sites[i].name}`] = `pnpm --filter ${sites[i].name} dev`
-      scripts[`preview:${sites[i].name}`] = `pnpm --filter ${sites[i].name} preview`
+      scripts[`dev:${sites[i].name}`] = filterCmd(pm, sites[i].name, 'dev')
+      scripts[`preview:${sites[i].name}`] = filterCmd(pm, sites[i].name, 'preview')
     }
   }
 
@@ -108,16 +128,17 @@ export function computeRootScripts(sites) {
  * Update root scripts after adding a new site
  * @param {string} rootDir - Workspace root directory
  * @param {Array<{name: string, path: string}>} sites - All sites (including new one)
+ * @param {'pnpm' | 'npm'} [pm='pnpm'] - Package manager
  */
-export async function updateRootScripts(rootDir, sites) {
+export async function updateRootScripts(rootDir, sites, pm = 'pnpm') {
   const pkg = await readRootPackageJson(rootDir)
-  const newScripts = computeRootScripts(sites)
+  const newScripts = computeRootScripts(sites, pm)
 
   // If we're adding a second site, rename existing dev/preview to dev:{firstName}
   if (sites.length === 2 && pkg.scripts?.dev) {
     const firstName = sites[0].name
-    // Only rename if the existing dev matches the first site
-    if (pkg.scripts.dev === `pnpm --filter ${firstName} dev`) {
+    // Only rename if the existing dev script references the first site's name
+    if (pkg.scripts.dev.includes(firstName)) {
       pkg.scripts[`dev:${firstName}`] = pkg.scripts.dev
       pkg.scripts[`preview:${firstName}`] = pkg.scripts.preview
     }

package/src/utils/pm.js

@@ -0,0 +1,51 @@
+/**
+ * Package Manager Detection
+ *
+ * Detect whether the user ran the CLI via npm or pnpm,
+ * and generate PM-appropriate commands for output messages.
+ */
+
+/**
+ * Detect which package manager invoked the CLI.
+ * Uses the standard npm_config_user_agent env var (same technique as create-vite, create-next-app).
+ * @returns {'pnpm' | 'npm'}
+ */
+export function detectPackageManager() {
+  const ua = process.env.npm_config_user_agent || ''
+  if (ua.startsWith('pnpm/')) return 'pnpm'
+  return 'npm'
+}
+
+/**
+ * Generate a workspace-filtered command.
+ * pnpm: "pnpm --filter site dev"
+ * npm:  "npm -w site run dev"
+ * @param {'pnpm' | 'npm'} pm
+ * @param {string} pkg - Package name to filter to
+ * @param {string} cmd - Script name to run
+ * @returns {string}
+ */
+export function filterCmd(pm, pkg, cmd) {
+  return pm === 'pnpm'
+    ? `pnpm --filter ${pkg} ${cmd}`
+    : `npm -w ${pkg} run ${cmd}`
+}
+
+/**
+ * Generate an install command.
+ * @param {'pnpm' | 'npm'} pm
+ * @returns {string}
+ */
+export function installCmd(pm) {
+  return pm === 'pnpm' ? 'pnpm install' : 'npm install'
+}
+
+/**
+ * Generate a run-script command.
+ * @param {'pnpm' | 'npm'} pm
+ * @param {string} script - Script name
+ * @returns {string}
+ */
+export function runCmd(pm, script) {
+  return pm === 'pnpm' ? `pnpm ${script}` : `npm run ${script}`
+}

package/src/utils/workspace.js

@@ -1,24 +1,45 @@
 /**
  * Workspace Detection Utilities
  *
- * Detects pnpm workspace structure and classifies packages as foundations or sites.
+ * Detects workspace structure (pnpm-workspace.yaml or package.json workspaces)
+ * and classifies packages as foundations or sites.
  * Used by commands to auto-detect targets when run from workspace root.
  */
 
-import { existsSync, readdirSync } from 'node:fs'
+import { existsSync, readdirSync, readFileSync } from 'node:fs'
 import { readFile } from 'node:fs/promises'
 import { resolve, dirname, join } from 'node:path'
 import yaml from 'js-yaml'
 
 /**
- * Find workspace root by looking for pnpm-workspace.yaml
+ * Check if a directory is a workspace root.
+ * Recognizes pnpm-workspace.yaml or package.json with workspaces field.
+ * @param {string} dir - Directory to check
+ * @returns {boolean}
+ */
+function hasWorkspaceConfig(dir) {
+  if (existsSync(join(dir, 'pnpm-workspace.yaml'))) return true
+  const pkgPath = join(dir, 'package.json')
+  if (existsSync(pkgPath)) {
+    try {
+      const pkg = JSON.parse(readFileSync(pkgPath, 'utf-8'))
+      if (Array.isArray(pkg.workspaces)) return true
+    } catch {
+      // ignore
+    }
+  }
+  return false
+}
+
+/**
+ * Find workspace root by looking for pnpm-workspace.yaml or package.json workspaces
  * @param {string} startDir - Directory to start searching from
  * @returns {string|null} - Workspace root path or null
  */
 export function findWorkspaceRoot(startDir = process.cwd()) {
   let dir = startDir
   while (dir !== dirname(dir)) {
-    if (existsSync(join(dir, 'pnpm-workspace.yaml'))) {
+    if (hasWorkspaceConfig(dir)) {
       return dir
     }
     dir = dirname(dir)
@@ -71,20 +92,35 @@ function resolvePatterns(patterns, workspaceRoot) {
 }
 
 /**
- * Get workspace packages from pnpm-workspace.yaml
+ * Get workspace packages from pnpm-workspace.yaml or package.json workspaces
  * @param {string} workspaceRoot
  * @returns {Promise<string[]>} - Array of package directories (relative paths)
  */
 export async function getWorkspacePackages(workspaceRoot) {
+  // Try pnpm-workspace.yaml first
   const configPath = join(workspaceRoot, 'pnpm-workspace.yaml')
-  const content = await readFile(configPath, 'utf-8')
-  const config = yaml.load(content)
+  if (existsSync(configPath)) {
+    const content = await readFile(configPath, 'utf-8')
+    const config = yaml.load(content)
+    if (config?.packages && Array.isArray(config.packages)) {
+      return resolvePatterns(config.packages, workspaceRoot)
+    }
+  }
 
-  if (!config?.packages || !Array.isArray(config.packages)) {
-    return []
+  // Fall back to package.json workspaces
+  const pkgPath = join(workspaceRoot, 'package.json')
+  if (existsSync(pkgPath)) {
+    try {
+      const pkg = JSON.parse(await readFile(pkgPath, 'utf-8'))
+      if (Array.isArray(pkg.workspaces)) {
+        return resolvePatterns(pkg.workspaces, workspaceRoot)
+      }
+    } catch {
+      // ignore
+    }
   }
 
-  return resolvePatterns(config.packages, workspaceRoot)
+  return []
 }
 
 /**
@@ -166,7 +202,7 @@ export async function findSites(workspaceRoot) {
  * @returns {boolean}
  */
 export function isWorkspaceRoot(dir = process.cwd()) {
-  return existsSync(join(dir, 'pnpm-workspace.yaml'))
+  return hasWorkspaceConfig(dir)
 }
 
 /**

package/templates/workspace/package.json.hbs

@@ -8,6 +8,13 @@
     "{{@key}}": "{{this}}"{{#unless @last}},{{/unless}}
     {{/each}}
   },
+  {{#if workspaceGlobs.length}}
+  "workspaces": [
+    {{#each workspaceGlobs}}
+    "{{this}}"{{#unless @last}},{{/unless}}
+    {{/each}}
+  ],
+  {{/if}}
   "devDependencies": {
     "@types/node": "^22.0.0",
     "uniweb": "{{version "uniweb"}}"