Merge pull request 'Make generated Vue monorepos buildable with docker compose' (#9) from fix/vue-monorepo-docker into main

Reviewed-on: #9

Makefile

@@ -1,5 +1,5 @@
 PKG_NAME := git.fernandovideira.com/FernandoJVideira/draft
-VERSION := v0.1.0
+VERSION := v0.2.0
 GO_SOURCES := $(shell find . -name '*.go' -not -path './assets/testdata/*')
 
 .PHONY: version build windows win-arm linux mac prepare-embed clean

README.md

@@ -85,7 +85,7 @@ draft new client
 3. Scaffolds the base app via the official tooling (`nuxi init` for Nuxt, `create-vue` for Vue), so the generated boilerplate, dependency versions, and lockfile are always current rather than pinned by Draft
 4. Layers a Draft-maintained overlay on top: an auth store (login/logout/register/token refresh), route guards, API composable, and pages for login/signup/profile/organizations/email verification/invites — all wired up to talk to a Draft-generated API out of the box
 
-Both frameworks produce a comparable app: [`vue-ui-kit`](https://git.fernandovideira.com/FernandoJVideira/vue-ui-kit) (installed from its own Gitea npm registry - see its README for the one-time `.npmrc` token setup) + Tailwind, the same component library and theme tokens on either framework.
+Both frameworks produce a comparable app: [`vue-ui-kit`](https://git.fernandovideira.com/FernandoJVideira/vue-ui-kit) (installed from its own Gitea npm registry - see its README for the one-time `.npmrc` token setup) + Tailwind, the same component library and theme tokens on either framework. Both clients ship with a Dockerfile that mounts that `~/.npmrc` as a build secret (wired up in the monorepo's `docker-compose.yml`), so container builds resolve the package without baking the token into the image - Nuxt runs its Nitro server, Vue is served by nginx with an SPA fallback and `/api/` proxied to the api container.
 
 ### Create a New Monorepo Project
 

cmd/client.go

@@ -68,8 +68,15 @@ func scaffoldClientNuxt(projectDir, serviceName string) error {
 		return fmt.Errorf("error running nuxi init: %w", err)
 	}
 
+	version, err := pnpmVersion()
+	if err != nil {
+		return fmt.Errorf("error detecting pnpm version: %w", err)
+	}
 	replacements := map[string]string{
 		"App Template": serviceName,
+		// The overlay's Dockerfile pins the pnpm that produced the template's
+		// lockfile; the generated project's lockfile comes from the local pnpm.
+		"[email protected]": "pnpm@" + version,
 	}
 	if err := copyEmbeddedDir("embedded/client-nuxt", projectDir, replacements); err != nil {
 		return fmt.Errorf("error copying client overlay: %w", err)
@@ -146,6 +153,19 @@ func patchNuxtConfig(projectDir, serviceName string) error {
 	return os.WriteFile(configPath, []byte(finalContent), 0644)
 }
 
+func insidePnpmWorkspace(dir string) bool {
+	for {
+		if _, err := os.Stat(filepath.Join(dir, "pnpm-workspace.yaml")); err == nil {
+			return true
+		}
+		parent := filepath.Dir(dir)
+		if parent == dir {
+			return false
+		}
+		dir = parent
+	}
+}
+
 func scaffoldClientVue(projectDir, serviceName string) error {
 	parentDir := filepath.Dir(projectDir)
 	leafName := filepath.Base(projectDir)
@@ -166,12 +186,19 @@ func scaffoldClientVue(projectDir, serviceName string) error {
 		return err
 	}
 
-	if err := os.WriteFile(
-		filepath.Join(projectDir, "pnpm-workspace.yaml"),
-		[]byte("allowBuilds:\n  vue-demi: true\n"),
-		0644,
-	); err != nil {
-		return fmt.Errorf("error writing pnpm-workspace.yaml: %w", err)
+	// A standalone client is its own workspace root and needs vue-demi's build
+	// script approved. Inside a monorepo the root pnpm-workspace.yaml already
+	// does that - and writing one here would make apps/client a separate
+	// workspace, so the installs below would update a nested lockfile and
+	// leave the root one describing the template's client instead of this one.
+	if !insidePnpmWorkspace(parentDir) {
+		if err := os.WriteFile(
+			filepath.Join(projectDir, "pnpm-workspace.yaml"),
+			[]byte("allowBuilds:\n  vue-demi: true\n"),
+			0644,
+		); err != nil {
+			return fmt.Errorf("error writing pnpm-workspace.yaml: %w", err)
+		}
 	}
 
 	fmt.Println("📦 Installing base dependencies...")
@@ -203,6 +230,9 @@ func scaffoldClientVue(projectDir, serviceName string) error {
 
 	replacements := map[string]string{
 		"App Template": serviceName,
+		// The overlay's Dockerfile pins the pnpm that produced the template's
+		// lockfile; the generated project's lockfile comes from the local pnpm.
+		"[email protected]": "pnpm@" + version,
 	}
 	if err := copyEmbeddedDir("embedded/client-vue", projectDir, replacements); err != nil {
 		return fmt.Errorf("error copying client overlay: %w", err)

tools/sync_templates.go

@@ -39,7 +39,7 @@ var jobs = []syncJob{
 		templateName:    "client-nuxt",
 		sourceDir:       "assets/testdata/template/apps/client",
 		targetDir:       "assets/embedded/client-nuxt",
-		includePrefixes: []string{"app/", "public/"},
+		includePrefixes: []string{"app/", "public/", "Dockerfile"},
 	},
 	{
 		templateName: "client-vue",
@@ -52,11 +52,12 @@ var jobs = []syncJob{
 			"src/stores/",
 			"src/composables/",
 			"src/lib/api-client.ts",
-			"src/components/AppBrand.vue",
-			"src/components/AppLayout.vue",
+			"src/components/",
 			"src/views/",
 			"src/shared/",
 			".env.example",
+			"Dockerfile",
+			"nginx.conf.template",
 		},
 	},
 }