chore(create-payload-app): add --init-next

packages/create-payload-app/package.json

@@ -6,8 +6,9 @@
     "create-payload-app": "bin/cli.js"
   },
   "scripts": {
-    "build": "pnpm build:swc",
-    "build:swc": "swc ./src -d ./dist --config-file .swcrc",
+    "build": "pnpm copyfiles && pnpm build:swc",
+    "copyfiles": "copyfiles -u 4 \"../next/src/app/(payload)/**\" \"dist/app\"",
+    "build:swc": "pnpm copyfiles && swc ./src -d ./dist --config-file .swcrc",
     "clean": "rimraf {dist,*.tsbuildinfo}",
     "test": "jest",
     "prepublishOnly": "pnpm test && pnpm clean && pnpm build"
@@ -26,6 +27,7 @@
     "execa": "^5.0.0",
     "figures": "^3.2.0",
     "fs-extra": "^9.0.1",
+    "globby": "11.1.0",
     "handlebars": "^4.7.7",
     "ora": "^5.1.0",
     "prompts": "^2.4.2",

packages/create-payload-app/src/lib/init-next.ts

@@ -0,0 +1,47 @@
+import fs from 'fs'
+import globby from 'globby'
+import path from 'path'
+
+import type { CliArgs } from '../types'
+
+import { copyRecursiveSync } from '../utils/copy-recursive-sync'
+
+export async function initNext(args: CliArgs): Promise<void> {
+  const { '--debug': debug } = args
+  const projectDir = process.cwd()
+
+  const foundConfig = (await globby('next.config.*js', { cwd: process.cwd() }))?.[0]
+  const nextConfigPath = path.resolve(projectDir, foundConfig)
+  if (!fs.existsSync(nextConfigPath)) {
+    console.log(
+      `No next.config.js found at ${nextConfigPath}. Ensure you are in a Next.js project directory.`,
+    )
+    process.exit(1)
+  } else {
+    if (debug) console.log(`Found Next config at ${nextConfigPath}`)
+  }
+
+  const templateFilesPath = __dirname.endsWith('dist')
+    ? path.resolve(__dirname, '../..', 'dist/app')
+    : path.resolve(__dirname, '../../../next/src/app')
+
+  console.log(`Using template files from: ${templateFilesPath}`)
+
+  if (!fs.existsSync(templateFilesPath)) {
+    console.log(`Could not find template source files from ${templateFilesPath}`)
+    process.exit(1)
+  } else {
+    console.log('Found template source files')
+  }
+
+  const userAppDir = path.resolve(projectDir, 'src/app')
+  if (!fs.existsSync(userAppDir)) {
+    console.log(`Could not find user app directory at ${userAppDir}`)
+    process.exit(1)
+  } else {
+    if (debug) console.log(`Found user app directory: ${userAppDir}`)
+  }
+
+  copyRecursiveSync(templateFilesPath, userAppDir, debug)
+  process.exit(0)
+}

packages/create-payload-app/src/main.ts

@@ -6,6 +6,7 @@ import type { CliArgs, PackageManager } from './types'
 
 import { createProject } from './lib/create-project'
 import { generateSecret } from './lib/generate-secret'
+import { initNext } from './lib/init-next'
 import { parseProjectName } from './lib/parse-project-name'
 import { parseTemplate } from './lib/parse-template'
 import { selectDb } from './lib/select-db'
@@ -27,6 +28,9 @@ export class Main {
         '--secret': String,
         '--template': String,
 
+        // Next.js
+        '--init-next': Boolean,
+
         // Package manager
         '--no-deps': Boolean,
         '--use-npm': Boolean,
@@ -35,6 +39,7 @@ export class Main {
 
         // Flags
         '--beta': Boolean,
+        '--debug': Boolean,
         '--dry-run': Boolean,
 
         // Aliases
@@ -53,6 +58,12 @@ export class Main {
         console.log(helpMessage())
         process.exit(0)
       }
+
+      if (this.args['--init-next']) {
+        await initNext(this.args)
+        process.exit(0)
+      }
+
       const templateArg = this.args['--template']
       if (templateArg) {
         const valid = validateTemplate(templateArg)

packages/create-payload-app/src/types.ts

@@ -3,8 +3,10 @@ import type arg from 'arg'
 export interface Args extends arg.Spec {
   '--beta': BooleanConstructor
   '--db': StringConstructor
+  '--debug': BooleanConstructor
   '--dry-run': BooleanConstructor
   '--help': BooleanConstructor
+  '--init-next': BooleanConstructor
   '--name': StringConstructor
   '--no-deps': BooleanConstructor
   '--secret': StringConstructor
@@ -12,6 +14,9 @@ export interface Args extends arg.Spec {
   '--use-npm': BooleanConstructor
   '--use-pnpm': BooleanConstructor
   '--use-yarn': BooleanConstructor
+
+  // Aliases
+
   '-h': string
   '-n': string
   '-t': string

packages/create-payload-app/src/utils/copy-recursive-sync.ts

@@ -0,0 +1,21 @@
+import fs from 'fs'
+import path from 'path'
+
+/**
+ * Recursively copy files from src to dest
+ */
+export function copyRecursiveSync(src: string, dest: string, debug?: boolean) {
+  const exists = fs.existsSync(src)
+  const stats = exists && fs.statSync(src)
+  const isDirectory = exists && stats.isDirectory()
+  if (isDirectory) {
+    fs.mkdirSync(dest, { recursive: true })
+    fs.readdirSync(src).forEach((childItemName) => {
+      if (debug) console.log(`Copying: ${src}/${childItemName} -> ${dest}/${childItemName}`)
+      copyRecursiveSync(path.join(src, childItemName), path.join(dest, childItemName))
+    })
+  } else {
+    if (debug) console.log(`Copying: ${src} -> ${dest}`)
+    fs.copyFileSync(src, dest)
+  }
+}

pnpm-lock.yaml

@@ -269,6 +269,9 @@ importers:
       fs-extra:
         specifier: ^9.0.1
         version: 9.1.0
+      globby:
+        specifier: 11.1.0
+        version: 11.1.0
       handlebars:
         specifier: ^4.7.7
         version: 4.7.8