buner 0.0.2 → 1.0.0

package/bin/buner.js

@@ -0,0 +1,566 @@
+#!/usr/bin/env node
+import path from "path";
+import { execSync, spawn } from "child_process";
+import { Command } from "commander";
+import chalk from "chalk";
+import fetch from "node-fetch";
+import prompts from "prompts";
+import fs from "fs";
+import fs$1 from "fs/promises";
+import { fileURLToPath } from "url";
+import os from "os";
+import { globby } from "globby";
+import { exec } from "node:child_process";
+import validateProjectName from "validate-npm-package-name";
+const name = "buner";
+const version = "1.0.0";
+const description = "Frontend build toolkit for Vite + React SSR projects — SCSS pipeline, prerender, SSR dev server, and backend integration.";
+const type = "module";
+const license = "MIT";
+const repository = { "type": "git", "url": "https://github.com/precise-alloy/buner.git" };
+const homepage = "https://www.npmjs.com/package/buner";
+const keywords = ["vite", "react", "ssr", "scss", "prerender", "frontend", "build-tool", "cli"];
+const bin = { "buner": "./bin/buner.js" };
+const files = ["bin", "cli", "xpack", "public", "server.ts", "prerender.ts", "integration.ts", "styles.ts", "scripts.ts", "states.ts", "migrate-scss.ts", "vite.config.ts", "index.html", "tsconfig.json", "eslint.config.mjs", "types.d.ts", ".env", ".env.development", ".env.eshn", "README.md"];
+const scripts = { "start": "bun run dev", "predev": "bun upgrade", "dev": 'concurrently --kill-others "bun styles.ts --watch" "bun states.ts --watch" "cross-env scriptOnly=true vite build --mode development --watch" "bun server.ts --mode development"', "serve": "bun server.ts", "watch": "bun server.ts", "build": "bun run build:static && bun run build:server", "build:eshn": "bun run build:static:eshn && bun run build:server:eshn", "preview": "vite preview", "build:server": "vite build --ssr src/entry-server.tsx --outDir dist/server", "build:server:eshn": "vite build --ssr src/entry-server.tsx --outDir dist/server --mode eshn", "build:static": "vite build --outDir dist/static", "build:static:eshn": "vite build --outDir dist/static --mode eshn", "generate": "bun states.ts && bun run styles && bun run build && bun prerender.ts --add-hash", "eshn": "bun states.ts && bun run styles && bun run build:eshn && bun prerender.ts --add-hash --mode eshn", "inte": "bun run styles && bun run build && bun prerender.ts && bun integration.ts", "styles": "bun styles.ts", "format": "prettier --write .", "lint": "eslint --fix", "cli:start": "vite build -c vite.cli.config.ts --watch", "cli:build": "vite build -c vite.cli.config.ts" };
+const engines = { "node": ">=20.0.0" };
+const dependencies = { "@vitejs/plugin-react": "^5.1.4", "autoprefixer": "^10.4.27", "chalk": "^5.5.0", "cheerio": "^1.2.0", "chokidar": "^4.0.3", "commander": "^14.0.3", "concurrently": "^9.2.0", "cross-env": "^10.1.0", "cssnano": "^7.1.0", "debounce": "^3.0.0", "express": "^5.2.1", "glob": "^13.0.6", "globby": "^16.1.1", "js-beautify": "^1.15.4", "lodash": "^4.17.21", "magic-string": "^0.30.17", "node-fetch": "^3.3.2", "postcss": "^8.5.8", "prompts": "^2.4.2", "sass": "^1.89.2", "slash": "^5.1.0", "validate-npm-package-name": "^7.0.0", "vite": "^7.0.6" };
+const peerDependencies = { "react": "^18.0.0 || ^19.0.0", "react-dom": "^18.0.0 || ^19.0.0", "react-router-dom": "^6.0.0 || ^7.0.0" };
+const devDependencies = { "@eslint/compat": "^2.0.0", "@next/eslint-plugin-next": "^16.0.8", "@types/css": "^0.0.38", "@types/debounce": "^1.2.4", "@types/express": "^5.0.6", "@types/js-beautify": "^1.14.3", "@types/lodash": "^4.17.24", "@types/node": "^24.11.0", "@types/prettier": "^3.0.0", "@types/prompts": "^2.4.9", "@types/react": "^19.2.14", "@types/react-dom": "^19.1.7", "@types/validate-npm-package-name": "^4.0.2", "@typescript-eslint/eslint-plugin": "^8.50.0", "@typescript-eslint/parser": "^8.50.0", "css": "^3.0.0", "eslint": "^9.39.2", "eslint-config-next": "^16.0.8", "eslint-config-prettier": "10.1.8", "eslint-plugin-import": "2.32.0", "eslint-plugin-jsx-a11y": "6.10.2", "eslint-plugin-node": "11.1.0", "eslint-plugin-prettier": "^5.5.5", "eslint-plugin-react": "7.37.5", "eslint-plugin-react-hooks": "7.0.1", "eslint-plugin-react-refresh": "^0.5.2", "eslint-plugin-unused-imports": "^4.4.1", "globals": "^16.3.0", "msw": "^2.12.10", "postcss-scss": "^4.0.9", "prettier": "^3.6.2", "react": "^19.2.4", "react-dom": "^19.2.4", "react-router-dom": "^7.13.1", "rollup": "^4.59.0", "svgo": "^4.0.0" };
+const msw = { "workerDirectory": "public" };
+const packageJson = {
+  name,
+  version,
+  description,
+  type,
+  license,
+  repository,
+  homepage,
+  keywords,
+  bin,
+  files,
+  scripts,
+  engines,
+  dependencies,
+  peerDependencies,
+  devDependencies,
+  msw
+};
+const isWriteable = async (directory) => {
+  try {
+    await fs.promises.access(directory, fs.constants.W_OK);
+    return true;
+  } catch (err) {
+    return false;
+  }
+};
+const makeDir = (root, options = { recursive: true }) => {
+  return fs.promises.mkdir(root, options);
+};
+const isFolderEmpty = (root) => {
+  const validFiles = [
+    ".DS_Store",
+    ".git",
+    ".gitattributes",
+    ".gitignore",
+    ".gitlab-ci.yml",
+    ".hg",
+    ".hgcheck",
+    ".hgignore",
+    ".idea",
+    ".npmignore",
+    ".travis.yml",
+    "LICENSE",
+    "Thumbs.db",
+    "docs",
+    "mkdocs.yml",
+    "npm-debug.log",
+    "yarn-debug.log",
+    "yarn-error.log",
+    "yarnrc.yml",
+    ".yarn"
+  ];
+  const conflicts = fs.readdirSync(root).filter((file) => !validFiles.includes(file)).filter((file) => !/\.iml$/.test(file));
+  if (conflicts.length > 0) {
+    return false;
+  }
+  return true;
+};
+function isInGitRepository() {
+  try {
+    execSync("git rev-parse --is-inside-work-tree", { stdio: "ignore" });
+    return true;
+  } catch (_) {
+  }
+  return false;
+}
+function isInMercurialRepository() {
+  try {
+    execSync("hg --cwd . root", { stdio: "ignore" });
+    return true;
+  } catch (_) {
+  }
+  return false;
+}
+function isDefaultBranchSet() {
+  try {
+    execSync("git config init.defaultBranch", { stdio: "ignore" });
+    return true;
+  } catch (_) {
+  }
+  return false;
+}
+const tryGitInit = (root) => {
+  let didInit = false;
+  try {
+    execSync("git --version", { stdio: "ignore" });
+    if (isInGitRepository() || isInMercurialRepository()) {
+      return false;
+    }
+    execSync("git init", { stdio: "ignore" });
+    didInit = true;
+    if (!isDefaultBranchSet()) {
+      execSync("git checkout -b main", { stdio: "ignore" });
+    }
+    execSync("git add -A", { stdio: "ignore" });
+    execSync('git commit -m "Initial commit from Create App"', {
+      stdio: "ignore"
+    });
+    return true;
+  } catch (e) {
+    if (didInit) {
+      try {
+        fs.rmSync(path.join(root, ".git"), { recursive: true, force: true });
+      } catch (_) {
+      }
+    }
+    return false;
+  }
+};
+const excludeFiles = [
+  ".git",
+  "bin",
+  ".vscode",
+  ".build",
+  "public/samples",
+  "public/assets/vendors",
+  "src/_api/!(_base.ts)",
+  "src/_data",
+  "src/assets/scripts/!(color-mode|main|mock-api|pl-states|root|theme-critical).entry.ts",
+  "src/atoms",
+  "src/mocks/avatar",
+  "src/mocks/user",
+  "src/molecules",
+  "src/organisms/!(root|header|footer)/*",
+  "src/pages/!(Root|Home).tsx",
+  "src/templates/!(root|home)/*",
+  "!cli",
+  "!vite.cli.config.ts"
+];
+const copy = async (src, dest, { cwd }) => {
+  const sourceFiles = await globby(src, {
+    cwd,
+    dot: true,
+    absolute: false,
+    gitignore: true,
+    ignore: excludeFiles
+  });
+  const destRelativeToCwd = path.resolve(dest);
+  await fs$1.mkdir(path.join(destRelativeToCwd, "src/atoms"), { recursive: true });
+  await fs$1.mkdir(path.join(destRelativeToCwd, "src/molecules"), { recursive: true });
+  await fs$1.mkdir(path.join(destRelativeToCwd, "src/mocks/example"), { recursive: true });
+  return Promise.all(
+    sourceFiles.map(async (p) => {
+      const dirname2 = path.dirname(p);
+      const basename = path.basename(p);
+      const from = path.resolve(cwd, p);
+      const filePath = path.join(destRelativeToCwd, dirname2, basename);
+      await fs$1.mkdir(path.dirname(filePath), { recursive: true });
+      return fs$1.copyFile(from, filePath);
+    })
+  );
+};
+const { red: red$1 } = chalk;
+const install = async () => {
+  return new Promise((resolve, reject) => {
+    exec("npm install", (error, stdout) => {
+      if (error) {
+        reject(error);
+        console.log(`${red$1(error)}`);
+        return;
+      }
+      console.log(stdout);
+      resolve(stdout);
+    });
+  });
+};
+const formatFiles = async (root) => {
+  let filePath, data;
+  filePath = path.join(root, "src/mocks/handlers.ts");
+  data = "import { handlers } from './consts';\n\nexport { handlers };";
+  await fs$1.writeFile(filePath, data + os.EOL);
+  filePath = path.join(root, "src/mocks/example/index.ts");
+  data = `
+    import { handlers } from '@mocks/handlers';
+    import { rest } from 'msw';
+
+    handlers.push(
+      rest.get('/api/example', (req, res, ctx) => {
+        return res(ctx.status(200), ctx.json({test: 'test'}));
+      })
+    );
+  `;
+  await fs$1.writeFile(filePath, data + os.EOL);
+  filePath = path.join(root, "src/react-loader.tsx");
+  data = await fs$1.readFile(filePath, "utf8");
+  data = data.replace(
+    /const blocks((?!};).)*};/s,
+    "const blocks: { [name: string]: any } = {\n	root: lazy(() => import('./organisms/root/Root')),\n};"
+  );
+  await fs$1.writeFile(filePath, data);
+  filePath = path.join(root, "src/_types/atoms.d.ts");
+  await fs$1.writeFile(
+    filePath,
+    `
+      import { BasedAtomicModel } from "./_general";
+    `
+  );
+  filePath = path.join(root, "src/_types/molecules.d.ts");
+  await fs$1.writeFile(
+    filePath,
+    `
+      import { BasedAtomicModel } from "./_general";
+    `
+  );
+  filePath = path.join(root, "src/_types/organisms.d.ts");
+  await fs$1.writeFile(
+    filePath,
+    `
+      import { BasedAtomicModel } from "./_general";
+
+      interface FooterModel extends BasedAtomicModel {}
+
+      interface HeaderModel extends BasedAtomicModel {}
+    `
+  );
+  filePath = path.join(root, "src/pages/Home.tsx");
+  await fs$1.writeFile(
+    filePath,
+    `
+      import Template from '@templates/home/Home';
+
+      const Home = () => {
+        return <Template footer={footer} header={header} />;
+      };
+
+      export default Home;
+    `
+  );
+  filePath = path.join(root, "src/templates/home/Home.tsx");
+  await fs$1.writeFile(
+    filePath,
+    `
+      import { FooterModel, HeaderModel } from '@_types/organisms';
+      import Footer from '@organisms/footer/Footer';
+      import Header from '@organisms/header/Header';
+
+      interface Props {
+        header?: HeaderModel;
+        footer?: FooterModel;
+      }
+
+      const Home = (model: Props) => {
+        const { header, footer } = model;
+
+        return (
+          <>
+            {header && <Header {...header} />}
+
+            <main>
+              // write components here
+            </main>
+
+            <Footer {...footer} />
+          </>
+        );
+      };
+
+      export default Home;
+    `
+  );
+  filePath = path.join(root, "src/organisms/header/Header.tsx");
+  await fs$1.writeFile(
+    filePath,
+    `
+      import { getModifiers } from '@helpers/functions';
+      import RequireCss from '@helpers/RequireCss';
+      import { HeaderModel } from '@_types/organisms';
+
+      const Header = (model: HeaderModel) => {
+        const modifiers = getModifiers(model, 'zzz-o-header');
+
+        return (
+          <header className={modifiers}>
+            <h2>Header</h2>
+            <RequireCss path="b-header" />
+          </header>
+        );
+      };
+
+      export default Header;
+    `
+  );
+  filePath = path.join(root, "src/organisms/header/Header.scss");
+  await fs$1.writeFile(filePath, "");
+  filePath = path.join(root, "src/organisms/footer/Footer.tsx");
+  await fs$1.writeFile(
+    filePath,
+    `
+      import { getModifiers } from '@helpers/functions';
+      import RequireCss from '@helpers/RequireCss';
+      import { FooterModel } from '@_types/organisms';
+
+      const Footer = (model: FooterModel) => {
+        const modifiers = getModifiers(model, 'zzz-o-footer');
+
+        return (
+          <footer className={modifiers}>
+            <h2>Footer</h2>
+            <RequireCss path="b-footer" />
+          </footer>
+        );
+      };
+
+      export default Footer;
+    `
+  );
+  filePath = path.join(root, "src/organisms/footer/Footer.scss");
+  await fs$1.writeFile(filePath, "");
+  return ["xxx"];
+};
+const filename = fileURLToPath(import.meta.url);
+const dirname = path.dirname(filename);
+const { cyan: cyan$1 } = chalk;
+const installTemplate = async (model) => {
+  const { appName, root } = model;
+  console.log("\nInitializing project");
+  const copySource = ["**"];
+  await copy(copySource, root, {
+    cwd: path.join(dirname, "..")
+  });
+  await formatFiles(root);
+  const packageJson2 = JSON.parse(await fs$1.readFile("package.json", "utf8"));
+  packageJson2.name = appName;
+  packageJson2.description = "";
+  packageJson2.version = "0.1.0";
+  delete packageJson2.bin;
+  packageJson2.scripts && Object.keys(packageJson2.scripts).map((scriptName) => {
+    if (scriptName.startsWith("cli")) {
+      delete packageJson2.scripts[scriptName];
+    }
+  });
+  packageJson2.dependencies && Object.keys(packageJson2.dependencies).map((dependency) => {
+    if (!dependency.startsWith("react")) {
+      delete packageJson2.dependencies[dependency];
+    }
+  });
+  const devDeps = Object.keys(packageJson2.devDependencies).length;
+  if (!devDeps) delete packageJson2.devDependencies;
+  await fs$1.writeFile(path.join(root, "package.json"), JSON.stringify(packageJson2, null, 2) + os.EOL);
+  console.log("\nInstalling dependencies:");
+  for (const dependency in packageJson2.dependencies) {
+    console.log(`- ${cyan$1(dependency)}`);
+  }
+  if (devDeps) {
+    console.log("\nInstalling devDependencies:");
+    for (const dependency in packageJson2.devDependencies) console.log(`- ${cyan$1(dependency)}`);
+  }
+  await install();
+};
+const { green: green$1 } = chalk;
+const createApp = async (model) => {
+  const { appPath } = model;
+  const root = path.resolve(appPath);
+  if (!await isWriteable(path.dirname(root))) {
+    console.error("The application path is not writable, please check folder permissions and try again.");
+    console.error("It is likely you do not have write permissions for this folder.");
+    process.exit(1);
+  }
+  const appName = path.basename(root);
+  await makeDir(root);
+  if (!isFolderEmpty(root)) {
+    console.log(`
+The directory ${green$1(appName)} contains files that could conflict or not empty`);
+    console.log("\nEither try using a new directory name, or remove these files.");
+    process.exit(1);
+  }
+  console.log(`
+Creating a new app in ${green$1(root)}.`);
+  process.chdir(root);
+  await installTemplate({
+    appName,
+    root
+  });
+  console.log("\nInitializing a git repository.");
+  if (tryGitInit(root)) {
+    console.log("\nInitialized a git repository.");
+  }
+  console.log(`
+${green$1("Success!")} Created ${appName} at ${appPath}`);
+};
+function validateNpmName(name2) {
+  const nameValidation = validateProjectName(name2);
+  if (nameValidation.validForNewPackages && !name2.startsWith("-")) {
+    return { valid: true };
+  }
+  return {
+    valid: false,
+    problems: [...nameValidation.errors || [], ...nameValidation.warnings || []]
+  };
+}
+const { green, yellow, bold, cyan, red } = chalk;
+const packageName = "buner";
+const run = (cmd, args = [], options = {}) => {
+  return new Promise((resolve, reject) => {
+    const child = spawn(cmd, args, {
+      stdio: "inherit",
+      shell: true,
+      cwd: process.cwd(),
+      ...options
+    });
+    child.on("close", (code) => {
+      if (code !== 0) {
+        reject(new Error(`Command "${cmd} ${args.join(" ")}" exited with code ${code}`));
+      } else {
+        resolve();
+      }
+    });
+    child.on("error", reject);
+  });
+};
+const runSync = (cmd) => {
+  execSync(cmd, { stdio: "inherit", cwd: process.cwd() });
+};
+const onPromptState = (state) => {
+  if (state?.aborted) {
+    process.stdout.write("\x1B[?25h");
+    process.stdout.write("\n");
+    process.exit(1);
+  }
+};
+const parseVersion = (version2) => {
+  return parseInt(version2.replaceAll(".", ""));
+};
+const update = fetch(`https://registry.npmjs.org/${packageJson.name}/latest`).then((res) => res.json()).catch(() => null);
+async function notifyUpdate() {
+  try {
+    const data = await update;
+    if (data.version && parseVersion(data.version) !== parseVersion(packageJson.version)) {
+      const updateMessage = `npm update -g ${packageName}`;
+      console.log(
+        yellow(bold(`A new version of '${packageName}' is available!`)) + "\nYou can update by running: " + cyan(updateMessage) + "\n"
+      );
+    }
+  } catch {
+  }
+}
+const program = new Command();
+program.name(packageName).description("Frontend build toolkit for Vite + React SSR projects").version(packageJson.version);
+program.command("create").argument("[project-directory]", "the project name", "").description("Scaffold a new frontend project").action(async (projectPath) => {
+  if (!projectPath) {
+    validateNpmName("my-app");
+    const res = await prompts({
+      onState: onPromptState,
+      type: "text",
+      name: "path",
+      message: "What is your project named?",
+      initial: "my-app",
+      validate: (name2) => {
+        const validation2 = validateNpmName(path.basename(path.resolve(name2)));
+        if (validation2.valid) {
+          return true;
+        }
+        return `Invalid project name ${validation2?.problems?.[0] ? validation2?.problems?.[0] : ""}`;
+      }
+    });
+    if (typeof res.path === "string") {
+      projectPath = res.path.trim();
+    }
+  }
+  if (!projectPath) {
+    console.log(
+      `
+Please specify the project directory:
+  ${cyan("buner create")} ${green("<project-directory>")}
+For example:
+  ${cyan("buner create")} ${green("my-app")}
+`
+    );
+    process.exit(1);
+  }
+  const resolvedProjectPath = path.resolve(projectPath);
+  await createApp({ appPath: resolvedProjectPath });
+  await notifyUpdate();
+});
+program.command("dev").description("Start development mode with all watchers").action(async () => {
+  await run("npx", [
+    "concurrently",
+    "--kill-others",
+    '"bun styles.ts --watch"',
+    '"bun states.ts --watch"',
+    '"cross-env scriptOnly=true npx vite build --mode development --watch"',
+    '"bun server.ts --mode development"'
+  ]);
+});
+program.command("serve").description("Start the SSR dev server").option("--mode <mode>", "server mode", "development").action(async (opts) => {
+  await run("bun", ["server.ts", "--mode", opts.mode]);
+});
+program.command("build").description("Build the project (static + SSR)").action(async () => {
+  runSync("npx vite build --outDir dist/static");
+  runSync("npx vite build --ssr src/entry-server.tsx --outDir dist/server");
+});
+program.command("generate").description("Full static site generation (states + styles + build + prerender)").option("--mode <mode>", "build mode", "production").action(async (opts) => {
+  runSync("bun states.ts");
+  runSync("bun styles.ts");
+  if (opts.mode === "production") {
+    runSync("npx vite build --outDir dist/static");
+    runSync("npx vite build --ssr src/entry-server.tsx --outDir dist/server");
+  } else {
+    runSync(`npx vite build --outDir dist/static --mode ${opts.mode}`);
+    runSync(`npx vite build --ssr src/entry-server.tsx --outDir dist/server --mode ${opts.mode}`);
+  }
+  runSync(`bun prerender.ts --add-hash --mode ${opts.mode}`);
+});
+program.command("eshn").description("Generate with --mode eshn").action(async () => {
+  runSync("bun states.ts");
+  runSync("bun styles.ts");
+  runSync("npx vite build --outDir dist/static --mode eshn");
+  runSync("npx vite build --ssr src/entry-server.tsx --outDir dist/server --mode eshn");
+  runSync("bun prerender.ts --add-hash --mode eshn");
+});
+program.command("inte").description("Build and integrate with backend (styles + build + prerender + integration)").action(async () => {
+  runSync("bun styles.ts");
+  runSync("npx vite build --outDir dist/static");
+  runSync("npx vite build --ssr src/entry-server.tsx --outDir dist/server");
+  runSync("bun prerender.ts");
+  runSync("bun integration.ts");
+});
+program.command("styles").description("Compile SCSS").option("--watch", "Watch for changes").action(async (opts) => {
+  const args = ["styles.ts"];
+  if (opts.watch) args.push("--watch");
+  await run("bun", args);
+});
+program.command("prerender").description("Pre-render HTML files").option("--add-hash", "Add content hashes to asset URLs").option("--mode <mode>", "build mode", "production").action(async (opts) => {
+  const args = ["prerender.ts"];
+  if (opts.addHash) args.push("--add-hash");
+  args.push("--mode", opts.mode);
+  await run("bun", args);
+});
+program.parseAsync(process.argv).catch(async (error) => {
+  console.log(red(error));
+  await notifyUpdate();
+  process.exit(1);
+});
+export {
+  packageName
+};

package/cli/README.md

@@ -0,0 +1 @@
+[![Build Status](https://episerver-es-emea.visualstudio.com/Alloy-Template/_apis/build/status%2FFE%20-%20Integration?branchName=fe-release)](https://episerver-es-emea.visualstudio.com/Alloy-Template/_build/latest?definitionId=28&branchName=fe-release)