create-pb-app 1.0.0

package/package.json

@@ -0,0 +1,7 @@
+{
+  "name": "create-pb-app",
+  "version": "1.0.0",
+  "type": "module",
+  "bin": { "create-pb-app": "./src/cli.js" },
+  "files": ["src"]
+}

package/src/cli.js

@@ -0,0 +1,118 @@
+#!/usr/bin/env node
+
+import { mkdirSync, writeFileSync } from 'fs';
+import { join, dirname } from 'path';
+import { execSync } from 'child_process';
+import { createInterface } from 'readline';
+import { getTemplates } from './templates.js';
+
+// ANSI colors
+const bold = (s) => `\x1b[1m${s}\x1b[0m`;
+const green = (s) => `\x1b[32m${s}\x1b[0m`;
+const cyan = (s) => `\x1b[36m${s}\x1b[0m`;
+const red = (s) => `\x1b[31m${s}\x1b[0m`;
+const dim = (s) => `\x1b[2m${s}\x1b[0m`;
+
+const args = process.argv.slice(2);
+
+if (args.includes('--help') || args.includes('-h')) {
+    console.log(`
+${bold('create-pb-app')} — scaffold a new project
+
+${bold('Usage:')}
+  ${cyan('create-pb-app')} ${dim('<project-name>')} ${dim('[options]')}
+
+${bold('Options:')}
+  ${dim('--skip-install')}   Skip npm install
+  ${dim('--help, -h')}       Show this help message
+`);
+    process.exit(0);
+}
+
+const skipInstall = args.includes('--skip-install');
+const projectName = args.find((a) => !a.startsWith('-'));
+
+if (!projectName) {
+    console.error(red('Error: Please provide a project name.'));
+    console.error(`  ${cyan('create-pb-app')} ${dim('<project-name>')}`);
+    process.exit(1);
+}
+
+// Validate npm package name (basic check)
+if (!/^[a-z0-9@][a-z0-9._\-/@]*$/.test(projectName)) {
+    console.error(red(`Error: "${projectName}" is not a valid npm package name.`));
+    process.exit(1);
+}
+
+const projectDir = join(process.cwd(), projectName);
+
+// Check if directory already exists
+try {
+    mkdirSync(projectDir);
+} catch (err) {
+    if (err.code === 'EEXIST') {
+        console.error(red(`Error: Directory "${projectName}" already exists.`));
+        process.exit(1);
+    }
+    throw err;
+}
+
+console.log();
+console.log(bold(`Creating ${green(projectName)}...`));
+console.log();
+
+// Write all template files
+const templates = getTemplates(projectName);
+
+for (const { filePath, content } of templates) {
+    const fullPath = join(projectDir, filePath);
+    mkdirSync(dirname(fullPath), { recursive: true });
+    writeFileSync(fullPath, content);
+    console.log(`  ${green('+')} ${filePath}`);
+}
+
+console.log();
+console.log(green(`Created ${templates.length} files.`));
+console.log();
+
+async function promptInstall() {
+    if (skipInstall) return false;
+
+    return new Promise((resolve) => {
+        const rl = createInterface({
+            input: process.stdin,
+            output: process.stdout
+        });
+
+        rl.question('Install dependencies? (Y/n) ', (answer) => {
+            rl.close();
+            const a = answer.trim().toLowerCase();
+            resolve(a === '' || a === 'y' || a === 'yes');
+        });
+    });
+}
+
+const shouldInstall = await promptInstall();
+
+if (shouldInstall) {
+    console.log();
+    console.log(dim('Running npm install...'));
+    console.log();
+    try {
+        execSync('npm install', { cwd: projectDir, stdio: 'inherit' });
+        console.log();
+        console.log(green('Dependencies installed.'));
+    } catch {
+        console.error(red('npm install failed. You can run it manually later.'));
+    }
+}
+
+console.log();
+console.log(bold('Done! Next steps:'));
+console.log();
+console.log(`  ${cyan(`cd ${projectName}`)}`);
+if (!shouldInstall) {
+    console.log(`  ${cyan('npm install')}`);
+}
+console.log(`  ${cyan('npm run dev')}`);
+console.log();

package/src/templates.js

@@ -0,0 +1,152 @@
+/**
+ * Returns all template files for a new project.
+ * @param {string} projectName
+ * @returns {{ filePath: string, content: string }[]}
+ */
+export function getTemplates(projectName) {
+    return [
+        {
+            filePath: 'package.json',
+            content: JSON.stringify({
+                name: projectName,
+                version: '1.0.0',
+                type: 'module',
+                scripts: {
+                    dev: 'vite',
+                    build: 'vite build'
+                },
+                dependencies: {
+                    'components-test-pb': '^0.0.3',
+                    'css-engine-test-pb': '^0.1.6',
+                    'jsx-framework-test-pb': '^0.2.2',
+                    'looserouter-test-pb': '^0.1.0'
+                },
+                devDependencies: {
+                    typescript: '^5.9.3',
+                    vite: '^7.3.1'
+                }
+            }, null, 2) + '\n'
+        },
+        {
+            filePath: 'tsconfig.json',
+            content: JSON.stringify({
+                compilerOptions: {
+                    target: 'ES2020',
+                    module: 'NodeNext',
+                    jsx: 'react-jsx',
+                    jsxImportSource: 'jsx-framework-test-pb',
+                    moduleResolution: 'NodeNext',
+                    esModuleInterop: true,
+                    skipLibCheck: true,
+                    outDir: './dist'
+                },
+                include: ['src/**/*']
+            }, null, 4) + '\n'
+        },
+        {
+            filePath: 'vite.config.ts',
+            content: `import { defineConfig } from 'vite';
+
+export default defineConfig({});
+`
+        },
+        {
+            filePath: 'index.html',
+            content: `<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>${projectName}</title>
+</head>
+
+<body>
+    <script type="module" src="./src/App/App.tsx"></script>
+</body>
+
+</html>
+`
+        },
+        {
+            filePath: '.gitignore',
+            content: `node_modules
+dist
+`
+        },
+        {
+            filePath: 'vercel.json',
+            content: JSON.stringify({
+                rewrites: [
+                    {
+                        source: '/(.*)',
+                        destination: '/index.html'
+                    }
+                ]
+            }, null, 4) + '\n'
+        },
+        {
+            filePath: 'src/App/App.tsx',
+            content: `import { render } from 'jsx-framework-test-pb';
+import { Home } from '../Pages/Home';
+import { createRouter, RouterView } from 'looserouter-test-pb';
+import { Main } from '../layouts';
+import { makeStaticStyles } from 'css-engine-test-pb';
+
+const useStaticStyles = makeStaticStyles({
+    body: {
+        margin: 0,
+        fontFamily: 'system-ui, -apple-system, sans-serif',
+        boxSizing: 'border-box'
+    }
+});
+
+useStaticStyles();
+
+const router = createRouter({
+    '/': (ctx) => <Main><Home /></Main>
+});
+
+const App = () => <RouterView router={router} />;
+
+render(<App />, document.body);
+`
+        },
+        {
+            filePath: 'src/Pages/Home/Home.tsx',
+            content: `import { Text } from 'components-test-pb';
+
+export function Home() {
+    return (
+        <>
+            <Text>Hello World</Text>
+        </>
+    );
+}
+`
+        },
+        {
+            filePath: 'src/Pages/Home/index.ts',
+            content: `export { Home } from './Home';
+`
+        },
+        {
+            filePath: 'src/layouts/Main.tsx',
+            content: `export function Main({ children }) {
+    return (
+        <>
+            <header></header>
+            {children}
+            <footer></footer>
+        </>
+    );
+}
+`
+        },
+        {
+            filePath: 'src/layouts/index.ts',
+            content: `export { Main } from './Main';
+`
+        }
+    ];
+}