create-harper 0.0.1 → 0.0.3

package/README.md

@@ -78,3 +78,8 @@ Currently supported template presets include:
 - `qwik-ts`
 
 You can use `.` for the project name to scaffold in the current directory.
+
+## Shout Out
+
+This project is based largely on the prior work of the Vite team on Create Vite:
+https://github.com/vitejs/vite/tree/main/packages/create-vite

package/index.js

@@ -1,43 +1,31 @@
 #!/usr/bin/env node
 import * as prompts from '@clack/prompts';
 import { determineAgent } from '@vercel/detect-agent';
-import spawn from 'cross-spawn';
 import mri from 'mri';
-import fs from 'node:fs';
-import path from 'node:path';
-import { fileURLToPath } from 'node:url';
-import { defaultTargetDir } from './lib/constants/defaultTargetDir.js';
-import { FRAMEWORKS } from './lib/constants/frameworks.js';
 import { helpMessage } from './lib/constants/helpMessage.js';
-import { TEMPLATES } from './lib/constants/templates.js';
-import { crawlTemplateDir } from './lib/fs/crawlTemplateDir.js';
-import { emptyDir } from './lib/fs/emptyDir.js';
 import { formatTargetDir } from './lib/fs/formatTargetDir.js';
-import { isEmpty } from './lib/fs/isEmpty.js';
-import { install } from './lib/install.js';
-import { getFullCustomCommand } from './lib/pkg/getFullCustomCommand.js';
-import { getInstallCommand } from './lib/pkg/getInstallCommand.js';
-import { getRunCommand } from './lib/pkg/getRunCommand.js';
-import { isValidPackageName } from './lib/pkg/isValidPackageName.js';
 import { pkgFromUserAgent } from './lib/pkg/pkgFromUserAgent.js';
-import { toValidPackageName } from './lib/pkg/toValidPackageName.js';
-import { start } from './lib/start.js';
+import { getEnvVars } from './lib/steps/getEnvVars.js';
+import { getImmediate } from './lib/steps/getImmediate.js';
+import { getPackageName } from './lib/steps/getPackageName.js';
+import { getProjectName } from './lib/steps/getProjectName.js';
+import { getTemplate } from './lib/steps/getTemplate.js';
+import { handleExistingDir } from './lib/steps/handleExistingDir.js';
+import { scaffoldProject } from './lib/steps/scaffoldProject.js';
+import { showOutro } from './lib/steps/showOutro.js';
 
 const argv = mri(process.argv.slice(2), {
 	boolean: ['help', 'overwrite', 'immediate', 'interactive'],
 	alias: { h: 'help', t: 'template', i: 'immediate' },
-	string: ['template'],
+	string: ['template', 'cli-target-username', 'cli-target'],
 });
-const cwd = process.cwd();
 
 init().catch((e) => {
 	console.error(e);
 });
 
 async function init() {
-	const argTargetDir = argv._[0]
-		? formatTargetDir(String(argv._[0]))
-		: undefined;
+	const argTargetDir = argv._[0] ? formatTargetDir(String(argv._[0])) : undefined;
 	const argTemplate = argv.template;
 	const argOverwrite = argv.overwrite;
 	const argImmediate = argv.immediate;
@@ -59,207 +47,42 @@ async function init() {
 		);
 	}
 
-	const pkgInfo = pkgFromUserAgent(process.env.npm_config_user_agent);
 	const cancel = () => prompts.cancel('Operation cancelled');
 
-	// 1. Get project name and target dir
-	let targetDir = argTargetDir;
-	let projectName = targetDir;
-	if (!targetDir) {
-		if (interactive) {
-			projectName = await prompts.text({
-				message: 'Project name:',
-				defaultValue: defaultTargetDir,
-				placeholder: defaultTargetDir,
-				validate: (value) => {
-					return !value || formatTargetDir(value).length > 0
-						? undefined
-						: 'Invalid project name';
-				},
-			});
-			if (prompts.isCancel(projectName)) { return cancel(); }
-			targetDir = formatTargetDir(projectName);
-		} else {
-			targetDir = defaultTargetDir;
-		}
-	}
+	// 1. Get the project name and target directory
+	const projectNameResult = await getProjectName(argTargetDir, interactive);
+	if (projectNameResult.cancelled) { return cancel(); }
+	const { projectName, targetDir } = projectNameResult;
 
-	// 2. Handle directory if exist and not empty
-	if (fs.existsSync(targetDir) && !isEmpty(targetDir)) {
-		let overwrite = argOverwrite
-			? 'yes'
-			: undefined;
-		if (!overwrite) {
-			if (interactive) {
-				const res = await prompts.select({
-					message: (targetDir === '.'
-						? 'Current directory'
-						: `Target directory "${targetDir}"`)
-						+ ` is not empty. Please choose how to proceed:`,
-					options: [
-						{
-							label: 'Cancel operation',
-							value: 'no',
-						},
-						{
-							label: 'Remove existing files and continue',
-							value: 'yes',
-						},
-						{
-							label: 'Ignore files and continue',
-							value: 'ignore',
-						},
-					],
-				});
-				if (prompts.isCancel(res)) { return cancel(); }
-				overwrite = res;
-			} else {
-				overwrite = 'no';
-			}
-		}
+	// 2. Handle if the directory exists and isn't empty
+	const handleExistingDirResult = await handleExistingDir(targetDir, argOverwrite, interactive);
+	if (handleExistingDirResult.cancelled) { return cancel(); }
 
-		switch (overwrite) {
-			case 'yes':
-				emptyDir(targetDir);
-				break;
-			case 'no':
-				cancel();
-				return;
-		}
-	}
-
-	// 3. Get package name
-	let packageName = path.basename(path.resolve(targetDir));
-	if (!isValidPackageName(packageName)) {
-		if (interactive) {
-			const packageNameResult = await prompts.text({
-				message: 'Package name:',
-				defaultValue: toValidPackageName(packageName),
-				placeholder: toValidPackageName(packageName),
-				validate(dir) {
-					if (dir && !isValidPackageName(dir)) {
-						return 'Invalid package.json name';
-					}
-				},
-			});
-			if (prompts.isCancel(packageNameResult)) { return cancel(); }
-			packageName = packageNameResult;
-		} else {
-			packageName = toValidPackageName(packageName);
-		}
-	}
+	// 3. Get the package name
+	const packageNameResult = await getPackageName(targetDir, interactive);
+	if (packageNameResult.cancelled) { return cancel(); }
+	const { packageName } = packageNameResult;
 
 	// 4. Choose a framework and variant
-	let template = argTemplate;
-	let hasInvalidArgTemplate = false;
-	if (argTemplate && !TEMPLATES.includes(argTemplate)) {
-		template = undefined;
-		hasInvalidArgTemplate = true;
-	}
-	if (!template) {
-		if (interactive) {
-			const framework = await prompts.select({
-				message: hasInvalidArgTemplate
-					? `"${argTemplate}" isn't a valid template. Please choose from below: `
-					: 'Select a framework:',
-				options: FRAMEWORKS
-					.filter(framework => !framework.hidden)
-					.map((framework) => {
-						const frameworkColor = framework.color;
-						return {
-							label: frameworkColor(framework.display || framework.name),
-							value: framework,
-						};
-					}),
-			});
-			if (prompts.isCancel(framework)) { return cancel(); }
-
-			const variant = framework.variants.length === 1
-				? framework.variants[0].name
-				: await prompts.select({
-					message: 'Select a variant:',
-					options: framework.variants.map((variant) => {
-						const variantColor = variant.color;
-						const command = variant.customCommand
-							? getFullCustomCommand(variant.customCommand, pkgInfo).replace(
-								/ TARGET_DIR$/,
-								'',
-							)
-							: undefined;
-						return {
-							label: variantColor(variant.display || variant.name),
-							value: variant.name,
-							hint: command,
-						};
-					}),
-				});
-			if (prompts.isCancel(variant)) { return cancel(); }
-
-			template = variant;
-		} else {
-			template = 'vanilla-ts';
-		}
-	}
+	const templateResult = await getTemplate(argTemplate, interactive);
+	if (templateResult.cancelled) { return cancel(); }
+	const { template } = templateResult;
 
+	// 5. Should we do a package manager installation?
+	const pkgInfo = pkgFromUserAgent(process.env.npm_config_user_agent);
 	const pkgManager = pkgInfo ? pkgInfo.name : 'npm';
+	const immediateResult = await getImmediate(argImmediate, interactive, pkgManager);
+	if (immediateResult.cancelled) { return cancel(); }
+	const { immediate } = immediateResult;
 
-	const root = path.join(cwd, targetDir);
+	// 6. Get environment variables for .env file
+	const envVarsResult = await getEnvVars(argv, interactive, template);
+	if (envVarsResult.cancelled) { return cancel(); }
+	const { envVars } = envVarsResult;
 
-	const { customCommand } = FRAMEWORKS.flatMap((f) => f.variants).find((v) => v.name === template) ?? {};
+	// 7. Write out the contents based on all prior steps.
+	const root = scaffoldProject(targetDir, projectName, packageName, template, envVars);
 
-	if (customCommand) {
-		const fullCustomCommand = getFullCustomCommand(customCommand, pkgInfo);
-
-		const [command, ...args] = fullCustomCommand.split(' ');
-		// we replace TARGET_DIR here because targetDir may include a space
-		const replacedArgs = args.map((arg) => arg.replace('TARGET_DIR', () => targetDir));
-		const { status } = spawn.sync(command, replacedArgs, {
-			stdio: 'inherit',
-		});
-		process.exit(status ?? 0);
-	}
-
-	// 5. Ask about immediate install and package manager
-	let immediate = argImmediate;
-	if (immediate === undefined) {
-		if (interactive) {
-			const immediateResult = await prompts.confirm({
-				message: `Install with ${pkgManager} and start now?`,
-			});
-			if (prompts.isCancel(immediateResult)) { return cancel(); }
-			immediate = immediateResult;
-		} else {
-			immediate = false;
-		}
-	}
-
-	// Only create a directory for built-in templates, not for customCommand
-	fs.mkdirSync(root, { recursive: true });
-	prompts.log.step(`Scaffolding project in ${root}...`);
-
-	const context = {
-		projectName,
-		packageName,
-	};
-
-	const templateSharedDir = path.resolve(fileURLToPath(import.meta.url), '..', `template-shared`);
-	crawlTemplateDir(root, templateSharedDir, context);
-
-	const templateDir = path.resolve(fileURLToPath(import.meta.url), '..', `template-${template}`);
-	crawlTemplateDir(root, templateDir, context);
-
-	if (immediate) {
-		install(root, pkgManager);
-		start(root, pkgManager);
-	} else {
-		let doneMessage = '';
-		const cdProjectName = path.relative(cwd, root);
-		doneMessage += `Done. Now run:\n`;
-		if (root !== cwd) {
-			doneMessage += `\n  cd ${cdProjectName.includes(' ') ? `"${cdProjectName}"` : cdProjectName}`;
-		}
-		doneMessage += `\n  ${getInstallCommand(pkgManager).join(' ')}`;
-		doneMessage += `\n  ${getRunCommand(pkgManager, 'dev').join(' ')}`;
-		prompts.outro(doneMessage);
-	}
+	// 8. Log out the next steps.
+	showOutro(root, pkgManager, immediate);
 }

package/lib/constants/defaultTargetDir.js

@@ -0,0 +1 @@
+export const defaultTargetDir = 'harper-project';

package/lib/constants/frameworks.js

@@ -0,0 +1,75 @@
+import colors from 'picocolors';
+
+const {
+	blue,
+	cyan,
+	gray,
+	yellow,
+} = colors;
+
+export const FRAMEWORKS = [
+	{
+		name: 'vanilla',
+		display: 'Vanilla',
+		color: yellow,
+		variants: [
+			{
+				name: 'vanilla-ts',
+				display: 'TypeScript',
+				color: blue,
+			},
+			{
+				name: 'vanilla',
+				display: 'JavaScript',
+				color: yellow,
+			},
+		],
+	},
+	{
+		name: 'react',
+		display: 'React',
+		color: cyan,
+		variants: [
+			{
+				name: 'react-ts',
+				display: 'TypeScript',
+				color: blue,
+			},
+			{
+				name: 'react',
+				display: 'JavaScript',
+				color: yellow,
+			},
+		],
+	},
+	{
+		name: 'studio',
+		hidden: true,
+		display: 'Studio',
+		color: gray,
+		variants: [
+			{
+				name: 'studio-ts',
+				display: 'TypeScript',
+				color: gray,
+			},
+			{
+				name: 'studio',
+				display: 'JavaScript',
+				color: gray,
+			},
+		],
+	},
+	{
+		name: 'barebones',
+		display: 'Barebones',
+		color: gray,
+		variants: [
+			{
+				name: 'barebones',
+				display: 'Barebones',
+				color: gray,
+			},
+		],
+	},
+];

package/lib/constants/helpMessage.js

@@ -0,0 +1,23 @@
+import colors from 'picocolors';
+
+const {
+	cyan,
+	green,
+	yellow,
+} = colors;
+
+export const helpMessage = `\
+Usage: create-harper [OPTION]... [DIRECTORY]
+
+Create a new Harper project in JavaScript or TypeScript.
+When running in TTY, the CLI will start in interactive mode.
+
+Options:
+  -t, --template NAME                   use a specific template
+  -i, --immediate                       install dependencies and start dev
+  --interactive / --no-interactive      force interactive / non-interactive mode
+
+Available templates:
+${yellow('vanilla-ts          vanilla')}
+${green('vue-ts              vue')}
+${cyan('react-ts            react')}`;

package/lib/constants/renameFiles.js

@@ -0,0 +1,7 @@
+export const renameFiles = {
+	_aiignore: '.aiignore',
+	_gitignore: '.gitignore',
+	_github: '.github',
+	'_env.example': '.env.example',
+	'_env': '.env',
+};

package/lib/constants/templates.js

@@ -0,0 +1,6 @@
+import { FRAMEWORKS } from './frameworks.js';
+
+export const TEMPLATES = FRAMEWORKS.map((f) => f.variants.map((v) => v.name)).reduce(
+	(a, b) => a.concat(b),
+	[],
+);

package/lib/fs/applyAndWriteTemplateFile.js

@@ -0,0 +1,9 @@
+import fs from 'node:fs';
+
+export function applyAndWriteTemplateFile(targetPath, templatePath, substitutions) {
+	let updatedContent = fs.readFileSync(templatePath, 'utf-8');
+	for (const variableName in substitutions) {
+		updatedContent = updatedContent.replaceAll(variableName, substitutions[variableName]);
+	}
+	fs.writeFileSync(targetPath, updatedContent);
+}

package/lib/fs/copy.js

@@ -0,0 +1,11 @@
+import fs from 'node:fs';
+import { copyDir } from './copyDir.js';
+
+export function copy(src, dest) {
+	const stat = fs.statSync(src);
+	if (stat.isDirectory()) {
+		copyDir(src, dest);
+	} else {
+		fs.copyFileSync(src, dest);
+	}
+}

package/lib/fs/copyDir.js

@@ -0,0 +1,12 @@
+import fs from 'node:fs';
+import path from 'node:path';
+import { copy } from './copy.js';
+
+export function copyDir(srcDir, destDir) {
+	fs.mkdirSync(destDir, { recursive: true });
+	for (const file of fs.readdirSync(srcDir)) {
+		const srcFile = path.resolve(srcDir, file);
+		const destFile = path.resolve(destDir, file);
+		copy(srcFile, destFile);
+	}
+}

package/lib/fs/crawlTemplateDir.js

@@ -0,0 +1,18 @@
+import fs from 'node:fs';
+import path from 'node:path';
+import { renameFiles } from '../constants/renameFiles.js';
+import { applyAndWriteTemplateFile } from './applyAndWriteTemplateFile.js';
+
+export function crawlTemplateDir(root, dir, substitutions) {
+	const files = fs.readdirSync(dir);
+	for (const file of files) {
+		const targetPath = path.join(root, renameFiles[file] ?? file);
+		const templatePath = path.join(dir, file);
+		if (fs.lstatSync(templatePath).isDirectory()) {
+			fs.mkdirSync(targetPath, { recursive: true });
+			crawlTemplateDir(targetPath, templatePath, substitutions);
+		} else {
+			applyAndWriteTemplateFile(targetPath, templatePath, substitutions);
+		}
+	}
+}

package/lib/fs/emptyDir.js

@@ -0,0 +1,14 @@
+import fs from 'node:fs';
+import path from 'node:path';
+
+export function emptyDir(dir) {
+	if (!fs.existsSync(dir)) {
+		return;
+	}
+	for (const file of fs.readdirSync(dir)) {
+		if (file === '.git') {
+			continue;
+		}
+		fs.rmSync(path.resolve(dir, file), { recursive: true, force: true });
+	}
+}

package/lib/fs/formatTargetDir.js

@@ -0,0 +1,3 @@
+export function formatTargetDir(targetDir) {
+	return targetDir.trim().replace(/\/+$/g, '');
+}

package/lib/fs/isEmpty.js

@@ -0,0 +1,6 @@
+import fs from 'node:fs';
+
+export function isEmpty(path) {
+	const files = fs.readdirSync(path);
+	return files.length === 0 || (files.length === 1 && files[0] === '.git');
+}

package/lib/install.js

@@ -0,0 +1,17 @@
+import * as prompts from '@clack/prompts';
+import { getInstallCommand } from './pkg/getInstallCommand.js';
+import { run } from './run.js';
+
+export function install(root, agent) {
+	if (process.env._HARPER_TEST_CLI) {
+		prompts.log.step(
+			`Installing dependencies with ${agent}... (skipped in test)`,
+		);
+		return;
+	}
+	prompts.log.step(`Installing dependencies with ${agent}...`);
+	run(getInstallCommand(agent), {
+		stdio: 'inherit',
+		cwd: root,
+	});
+}

package/lib/pkg/getInstallCommand.js

@@ -0,0 +1,6 @@
+export function getInstallCommand(agent) {
+	if (agent === 'yarn') {
+		return [agent];
+	}
+	return [agent, 'install'];
+}

package/lib/pkg/getRunCommand.js

@@ -0,0 +1,12 @@
+export function getRunCommand(agent, script) {
+	switch (agent) {
+		case 'yarn':
+		case 'pnpm':
+		case 'bun':
+			return [agent, script];
+		case 'deno':
+			return [agent, 'task', script];
+		default:
+			return [agent, 'run', script];
+	}
+}

package/lib/pkg/isValidPackageName.js

@@ -0,0 +1,5 @@
+export function isValidPackageName(projectName) {
+	return /^(?:@[a-z\d\-*~][a-z\d\-*._~]*\/)?[a-z\d\-~][a-z\d\-._~]*$/.test(
+		projectName,
+	);
+}

package/lib/pkg/pkgFromUserAgent.js

@@ -0,0 +1,9 @@
+export function pkgFromUserAgent(userAgent) {
+	if (!userAgent) { return undefined; }
+	const pkgSpec = userAgent.split(' ')[0];
+	const pkgSpecArr = pkgSpec.split('/');
+	return {
+		name: pkgSpecArr[0],
+		version: pkgSpecArr[1],
+	};
+}

package/lib/pkg/toValidPackageName.js

@@ -0,0 +1,9 @@
+export function toValidPackageName(projectName) {
+	return projectName
+		.trim()
+		.toLowerCase()
+		.replace(/\s+/g, '-')
+		.replace(/^[._]/, '')
+		.replace(/[^a-z\d\-~]+/g, '-')
+		.replace(/-+$/, '');
+}

package/lib/run.js

@@ -0,0 +1,14 @@
+import spawn from 'cross-spawn';
+
+export function run([command, ...args], options) {
+	const { status, error } = spawn.sync(command, args, options);
+	if (status != null && status > 0) {
+		process.exit(status);
+	}
+
+	if (error) {
+		console.error(`\n${command} ${args.join(' ')} error!`);
+		console.error(error);
+		process.exit(1);
+	}
+}

package/lib/start.js

@@ -0,0 +1,15 @@
+import * as prompts from '@clack/prompts';
+import { getRunCommand } from './pkg/getRunCommand.js';
+import { run } from './run.js';
+
+export function start(root, agent) {
+	if (process.env._HARPER_TEST_CLI) {
+		prompts.log.step('Starting dev server... (skipped in test)');
+		return;
+	}
+	prompts.log.step('Starting dev server...');
+	run(getRunCommand(agent, 'dev'), {
+		stdio: 'inherit',
+		cwd: root,
+	});
+}

package/lib/steps/getEnvVars.js

@@ -0,0 +1,79 @@
+import * as prompts from '@clack/prompts';
+import fs from 'node:fs';
+import path from 'node:path';
+import { fileURLToPath } from 'node:url';
+
+/**
+ * Step 5: Get environment variables for .env file
+ * @param {any} argv
+ * @param {boolean} interactive
+ * @param {string} template
+ * @returns {Promise<{envVars: {username: string, target: string, password?: string}, cancelled: boolean}>}
+ */
+export async function getEnvVars(argv, interactive, template) {
+	const templateDir = path.resolve(
+		fileURLToPath(import.meta.url),
+		'..',
+		'..',
+		'..',
+		`template-${template}`,
+	);
+	const hasEnvFile = fs.existsSync(path.join(templateDir, '_env'));
+
+	if (!hasEnvFile) {
+		return {
+			envVars: {},
+			cancelled: false,
+		};
+	}
+
+	let username = argv['cli-target-username'];
+	let target = argv['cli-target'];
+	let password = '';
+
+	if (interactive) {
+		if (!username) {
+			const usernameResult = await prompts.text({
+				message: 'CLI Target Username:',
+				placeholder: 'YOUR_CLUSTER_USERNAME',
+			});
+
+			if (prompts.isCancel(usernameResult)) {
+				return { envVars: {}, cancelled: true };
+			}
+			username = usernameResult;
+		}
+
+		if (!target) {
+			const targetResult = await prompts.text({
+				message: 'CLI Target URL:',
+				placeholder: 'YOUR_FABRIC.HARPER.FAST_CLUSTER_URL_HERE',
+			});
+
+			if (prompts.isCancel(targetResult)) {
+				return { envVars: {}, cancelled: true };
+			}
+			target = targetResult;
+		}
+
+		const passwordResult = await prompts.password({
+			message: 'CLI Target Password:',
+		});
+
+		if (prompts.isCancel(passwordResult)) {
+			return { envVars: {}, cancelled: true };
+		}
+		password = passwordResult;
+	} else {
+		prompts.log.warn('Non-interactive mode: Please update your .env to add your CLI_TARGET_PASSWORD on your own.');
+	}
+
+	return {
+		envVars: {
+			username: username || 'YOUR_CLUSTER_USERNAME',
+			target: target || 'YOUR_FABRIC.HARPER.FAST_CLUSTER_URL_HERE',
+			password: password || 'YOUR_CLUSTER_PASSWORD',
+		},
+		cancelled: false,
+	};
+}