create-vike 0.0.4 → 0.0.304

package/dist/index.js

@@ -1,402 +0,0 @@
-var __create = Object.create;
-var __defProp = Object.defineProperty;
-var __defProps = Object.defineProperties;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getOwnPropSymbols = Object.getOwnPropertySymbols;
-var __getProtoOf = Object.getPrototypeOf;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __propIsEnum = Object.prototype.propertyIsEnumerable;
-var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp.call(b, prop))
-      __defNormalProp(a, prop, b[prop]);
-  if (__getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(b)) {
-      if (__propIsEnum.call(b, prop))
-        __defNormalProp(a, prop, b[prop]);
-    }
-  return a;
-};
-var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod));
-
-// src/index.ts
-var import_commander = require("commander");
-
-// src/generate.ts
-var import_path = __toESM(require("path"));
-var import_promises = __toESM(require("fs/promises"));
-var import_prettier = require("prettier");
-
-// src/config-generators/package-versions.json
-var _types_express = "4.17.13";
-var _types_node = "17.0.36";
-var _types_react_dom = "18.0.5";
-var _types_react = "18.0.9";
-var _vitejs_plugin_react_refresh = "1.3.6";
-var _vitejs_plugin_vue = "2.3.3";
-var _vue_compiler_sfc = "3.2.36";
-var _vue_server_renderer = "3.2.36";
-var cross_env = "7.0.3";
-var express = "4.18.1";
-var react_dom = "18.1.0";
-var react = "18.1.0";
-var ts_node = "10.8.0";
-var typescript = "4.7.2";
-var vite_plugin_ssr = "0.3.64";
-var vite = "2.9.9";
-var vue = "3.2.36";
-var package_versions_default = {
-  "@types/express": _types_express,
-  "@types/node": _types_node,
-  "@types/react-dom": _types_react_dom,
-  "@types/react": _types_react,
-  "@vitejs/plugin-react-refresh": _vitejs_plugin_react_refresh,
-  "@vitejs/plugin-vue": _vitejs_plugin_vue,
-  "@vue/compiler-sfc": _vue_compiler_sfc,
-  "@vue/server-renderer": _vue_server_renderer,
-  "cross-env": cross_env,
-  express,
-  "react-dom": react_dom,
-  react,
-  "ts-node": ts_node,
-  typescript,
-  "vite-plugin-ssr": vite_plugin_ssr,
-  vite,
-  vue
-};
-
-// src/config-generators/common.ts
-var ConfigGenerator = class {
-  constructor(language) {
-    this.language = language;
-  }
-  generateTsConfig() {
-    const config = deepClone(TS_CONFIG);
-    this.modifyTsConfig(config);
-    return JSON.stringify(config, void 0, 2);
-  }
-  generatePackageJson() {
-    const pkg = deepClone(PACKAGE_JSON);
-    if (this.language === "ts") {
-      pkg.scripts = __spreadValues(__spreadValues({}, pkg.scripts), TS_PACKAGE_JSON_OVERRIDES.scripts);
-      pkg.dependencies = [
-        ...pkg.dependencies,
-        ...TS_PACKAGE_JSON_OVERRIDES.dependencies
-      ];
-    }
-    this.modifyPackageJson(pkg);
-    pkg.dependencies = pkg.dependencies.sort();
-    const output = __spreadProps(__spreadValues({}, pkg), {
-      dependencies: Object.fromEntries(pkg.dependencies.map((dep) => {
-        if (!(dep in package_versions_default)) {
-          throw new Error("Unknown package " + dep);
-        }
-        return [dep, package_versions_default[dep]];
-      }))
-    });
-    return output;
-  }
-  generateViteConfig() {
-    const config = this.getViteConfig();
-    let out = `import ${config.frameworkImportName} from ${JSON.stringify(config.frameworkImportPackage)};
-`;
-    out += `import ssr from "vite-plugin-ssr/plugin";
-`;
-    if (this.language === "ts") {
-      out += `import { UserConfig } from "vite";
-`;
-    }
-    out += "\n";
-    if (this.language === "ts") {
-      out += `const config: UserConfig = `;
-    } else {
-      out += `export default `;
-    }
-    out += `{
-  plugins: [${config.frameworkImportName}(), ssr()],
-};
-`;
-    if (this.language === "ts") {
-      out += `
-export default config;
-`;
-    }
-    return out;
-  }
-};
-function deepClone(original) {
-  return JSON.parse(JSON.stringify(original));
-}
-var TS_CONFIG = {
-  compilerOptions: {
-    strict: true,
-    module: "ES2020",
-    moduleResolution: "Node",
-    target: "ES2017",
-    lib: ["DOM", "DOM.Iterable", "ESNext"],
-    types: ["vite/client"],
-    jsx: "react",
-    skipLibCheck: true,
-    esModuleInterop: true
-  },
-  "ts-node": { transpileOnly: true, compilerOptions: { module: "CommonJS" } }
-};
-var PACKAGE_JSON = {
-  scripts: {
-    dev: "npm run server",
-    prod: "npm run build && npm run server:prod",
-    build: "vite build && vite build --ssr",
-    server: "node ./server",
-    "server:prod": "cross-env NODE_ENV=production node ./server"
-  },
-  dependencies: ["cross-env", "express", "vite", "vite-plugin-ssr"]
-};
-var TS_PACKAGE_JSON_OVERRIDES = {
-  scripts: {
-    server: "ts-node ./server",
-    "server:prod": "cross-env NODE_ENV=production ts-node ./server"
-  },
-  dependencies: ["@types/express", "@types/node", "ts-node", "typescript"]
-};
-
-// src/config-generators/react.ts
-var ReactConfigGenerator = class extends ConfigGenerator {
-  modifyTsConfig() {
-  }
-  modifyPackageJson(pkg) {
-    pkg.dependencies.push(...REACT_DEPENDENCIES);
-    if (this.language === "ts") {
-      pkg.dependencies.push(...REACT_TS_DEPENDENCIES);
-    }
-  }
-  getViteConfig() {
-    return {
-      frameworkImportName: "reactRefresh",
-      frameworkImportPackage: "@vitejs/plugin-react-refresh"
-    };
-  }
-};
-var REACT_DEPENDENCIES = [
-  "@vitejs/plugin-react-refresh",
-  "react",
-  "react-dom"
-];
-var REACT_TS_DEPENDENCIES = ["@types/react", "@types/react-dom"];
-
-// src/config-generators/vue.ts
-var VueConfigGenerator = class extends ConfigGenerator {
-  modifyTsConfig(config) {
-    delete config.compilerOptions.jsx;
-  }
-  modifyPackageJson(pkg) {
-    pkg.dependencies.push(...VUE_DEPENDENCIES);
-  }
-  getViteConfig() {
-    return {
-      frameworkImportName: "vue",
-      frameworkImportPackage: "@vitejs/plugin-vue"
-    };
-  }
-};
-var VUE_DEPENDENCIES = [
-  "@vitejs/plugin-vue",
-  "@vue/compiler-sfc",
-  "@vue/server-renderer",
-  "vue"
-];
-
-// src/detect-package-manager.ts
-function detectPackageManager() {
-  const agent = process.env.npm_config_user_agent;
-  if (agent) {
-    const [program2] = agent.split("/");
-    if (program2 === "yarn")
-      return "yarn";
-    if (program2 === "pnpm")
-      return "pnpm";
-    if (program2 === "npm")
-      return "npm";
-  }
-  if (process.platform !== "win32") {
-    const parent = process.env._;
-    if (parent) {
-      if (parent.endsWith("pnpx") || parent.endsWith("pnpm"))
-        return "pnpm";
-      if (parent.endsWith("yarn"))
-        return "yarn";
-      if (parent.endsWith("npx") || parent.endsWith("npm"))
-        return "npm";
-    }
-  }
-  return null;
-}
-
-// src/run-command.ts
-var import_child_process = require("child_process");
-async function runCommand(command, ...args) {
-  return new Promise((resolve, reject) => {
-    const child = (0, import_child_process.spawn)(command, args, { stdio: "inherit" });
-    child.on("close", (code) => {
-      if (code === 0) {
-        resolve();
-      } else {
-        reject();
-      }
-    });
-  });
-}
-
-// src/generate.ts
-var import_walk = require("walk");
-var FILES_DIR = import_path.default.resolve(__dirname, "../files");
-async function generate({
-  outputDir,
-  typescript: typescript2,
-  react: react2,
-  vue: vue2,
-  clientRouter,
-  skipDependencies,
-  npm,
-  yarn,
-  pnpm,
-  initGitRepo,
-  createInitialCommit
-}) {
-  let error = false;
-  if (Number(npm) + Number(pnpm) + Number(yarn) > 1) {
-    process.stderr.write("Only one of npm, pnpm, or yarn can be specified\n");
-    error = true;
-  }
-  let packageManager = npm ? "npm" : pnpm ? "pnpm" : yarn ? "yarn" : void 0;
-  if (!packageManager) {
-    const detected = detectPackageManager();
-    packageManager = detected || "npm";
-  }
-  if (vue2 && react2) {
-    process.stderr.write("Cannot use both react and vue\n");
-    error = true;
-  } else if (!vue2 && !react2) {
-    process.stderr.write("Please specify either --react or --vue\n");
-    error = true;
-  }
-  if (error) {
-    process.exit(1);
-  }
-  const framework = vue2 ? "vue" : "react";
-  const features = ["vike", framework];
-  if (clientRouter)
-    features.push("client-router");
-  const language = typescript2 ? "ts" : "js";
-  async function findDirs(dir) {
-    return (await import_promises.default.readdir(import_path.default.join(FILES_DIR, dir), {
-      withFileTypes: true
-    })).filter((x) => x.isDirectory()).map((x) => ({
-      name: import_path.default.join(dir, x.name),
-      features: x.name.split("+")
-    })).sort((a, b) => a.features.length - b.features.length);
-  }
-  const dirs = [...await findDirs("shared"), ...await findDirs(language)].filter((x) => x.features.every((f) => features.includes(f))).map((x) => x.name);
-  console.log("Copying files");
-  const toBeCopied = {};
-  for (const dir of dirs) {
-    const files = await getFiles(dir);
-    files.forEach((x) => {
-      let targetName = x.slice(dir.length + 1);
-      if (targetName === "_gitignore")
-        targetName = ".gitignore";
-      toBeCopied[targetName] = x;
-    });
-  }
-  for (const [targetName, sourcePath] of Object.entries(toBeCopied)) {
-    const targetPath = import_path.default.join(outputDir, targetName);
-    const dirName = import_path.default.dirname(targetPath);
-    await import_promises.default.mkdir(dirName, { recursive: true });
-    await import_promises.default.copyFile(import_path.default.join(FILES_DIR, sourcePath), targetPath);
-  }
-  const generators = {
-    react: ReactConfigGenerator,
-    vue: VueConfigGenerator
-  };
-  console.log("Generating configutation files");
-  const generator = new generators[framework](language);
-  const prettierConfig = {};
-  const packageJson = generator.generatePackageJson();
-  if (yarn) {
-    packageJson.scripts.dev = "yarn server";
-    packageJson.scripts.prod = "yarn build && yarn server:prod";
-  } else if (pnpm) {
-    packageJson.scripts.dev = "pnpm run server";
-    packageJson.scripts.prod = "pnpm build && pnpm server:prod";
-  }
-  const packageJsonfileName = import_path.default.join(outputDir, "package.json");
-  await import_promises.default.writeFile(packageJsonfileName, (0, import_prettier.format)(JSON.stringify(packageJson), __spreadProps(__spreadValues({}, prettierConfig), {
-    filepath: packageJsonfileName
-  })));
-  if (language === "ts") {
-    const fn = import_path.default.join(outputDir, "tsconfig.json");
-    await import_promises.default.writeFile(fn, (0, import_prettier.format)(generator.generateTsConfig(), __spreadProps(__spreadValues({}, prettierConfig), { filepath: fn })));
-  }
-  const viteConfigFileName = import_path.default.join(outputDir, "vite.config." + language);
-  await import_promises.default.writeFile(viteConfigFileName, (0, import_prettier.format)(generator.generateViteConfig(), __spreadProps(__spreadValues({}, prettierConfig), {
-    filepath: viteConfigFileName
-  })));
-  process.chdir(outputDir);
-  if (!skipDependencies) {
-    console.log("Installing dependencies with", packageManager);
-    await runCommand(packageManager, "install");
-  }
-  if (initGitRepo) {
-    console.log("Initializing git repository");
-    await runCommand("git", "init");
-    if (initGitRepo === true)
-      initGitRepo = "main";
-    if (initGitRepo !== "master") {
-      await runCommand("git", "checkout", "-b", initGitRepo);
-    }
-    if (createInitialCommit) {
-      console.log("Creating initial commit");
-      if (createInitialCommit === true)
-        createInitialCommit = `Initialized Vike ${typescript2 ? "TypeScript" : "vanilla JavaScript"} boilerplate for ${react2 ? "React" : "Vue"}`;
-      await runCommand("git", "add", ".");
-      await runCommand("git", "commit", "-m", createInitialCommit);
-    }
-  } else if (createInitialCommit) {
-    console.warn("Ignoring initial commit because no git repo was initialized");
-  }
-}
-async function getFiles(dir) {
-  const files = [];
-  const walker = (0, import_walk.walk)(import_path.default.join(FILES_DIR, dir));
-  walker.on("file", (root, fileStats, next) => {
-    files.push(import_path.default.relative(FILES_DIR, import_path.default.join(root, fileStats.name)));
-    next();
-  });
-  await new Promise((resolve, reject) => {
-    walker.on("end", resolve);
-    walker.on("errors", (_, statsArr) => {
-      const errors = statsArr.map((stat) => stat.error);
-      reject(new Error(`Failed to walk ${dir}: ${errors.join(", ")}`));
-    });
-  });
-  return files;
-}
-
-// package.json
-var version = "0.0.4";
-
-// src/index.ts
-import_commander.program.description("Generates Vike application boilerplate").version(version).argument("<output-dir>", "Output directory").option("-t, --typescript", "use TypeScript", false).option("-n, --npm", "use npm package manager", false).option("-y, --yarn", "use yarn package manager", false).option("-p, --pnpm", "use pnpm package manager", false).option("-v, --vue", "use Vue", false).option("-r, --react", "use React", false).option("-c, --client-router", "use client router", false).option("-s, --skip-dependencies", "skip installing dependencies", false).option("-i, --init-git-repo [branch]", "initialize git repo", false).option("-m, --create-initial-commit [message]", "create initial commit", false).action((outputDir, options) => {
-  generate(__spreadValues({ outputDir }, options));
-}).parse();

package/files/js/react/pages/about/index.page.jsx

@@ -1,13 +0,0 @@
-import React from "react";
-import "./index.css";
-
-export { Page };
-
-function Page() {
-  return (
-    <>
-      <h1>About</h1>
-      <p>A colored page.</p>
-    </>
-  );
-}

package/files/js/react/renderer/Link.jsx

@@ -1,15 +0,0 @@
-import React from "react";
-import { usePageContext } from "./usePageContext";
-
-export { Link };
-
-function Link(props) {
-  const pageContext = usePageContext();
-  const className = [
-    props.className,
-    pageContext.urlPathname === props.href && "is-active",
-  ]
-    .filter(Boolean)
-    .join(" ");
-  return <a {...props} className={className} />;
-}

package/files/js/react/renderer/_default.page.client.jsx

@@ -1,19 +0,0 @@
-import ReactDOM from "react-dom";
-import React from "react";
-import { getPage } from "vite-plugin-ssr/client";
-import { PageWrapper } from "./PageWrapper";
-
-hydrate();
-
-async function hydrate() {
-  // We do Server Routing, but we can also do Client Routing by using `useClientRouter()`
-  // instead of `getPage()`, see https://vite-plugin-ssr.com/useClientRouter
-  const pageContext = await getPage();
-  const { Page, pageProps } = pageContext;
-  ReactDOM.hydrate(
-    <PageWrapper pageContext={pageContext}>
-      <Page {...pageProps} />
-    </PageWrapper>,
-    document.getElementById("page-view")
-  );
-}

package/files/js/react/renderer/_default.page.server.jsx

@@ -1,47 +0,0 @@
-import ReactDOMServer from "react-dom/server";
-import React from "react";
-import { PageWrapper } from "./PageWrapper";
-import { escapeInject, dangerouslySkipEscape } from "vite-plugin-ssr";
-import logoUrl from "./logo.svg";
-
-export { render };
-
-// See https://vite-plugin-ssr.com/data-fetching
-export const passToClient = ["pageProps", "urlPathname"];
-
-async function render(pageContext) {
-  const { Page, pageProps } = pageContext;
-  const pageHtml = ReactDOMServer.renderToString(
-    <PageWrapper pageContext={pageContext}>
-      <Page {...pageProps} />
-    </PageWrapper>
-  );
-
-  // See https://vite-plugin-ssr.com/html-head
-  const { documentProps } = pageContext;
-  const title = (documentProps && documentProps.title) || "Vite SSR app";
-  const desc =
-    (documentProps && documentProps.description) ||
-    "App using Vite + vite-plugin-ssr";
-
-  const documentHtml = escapeInject`<!DOCTYPE html>
-    <html lang="en">
-      <head>
-        <meta charset="UTF-8" />
-        <link rel="icon" href="${logoUrl}" />
-        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-        <meta name="description" content="${desc}" />
-        <title>${title}</title>
-      </head>
-      <body>
-        <div id="page-view">${dangerouslySkipEscape(pageHtml)}</div>
-      </body>
-    </html>`;
-
-  return {
-    documentHtml,
-    pageContext: {
-      // We can add some `pageContext` here, which is useful if we want to do page redirection https://vite-plugin-ssr.com/page-redirection
-    },
-  };
-}

package/files/js/react/renderer/usePageContext.jsx

@@ -1,18 +0,0 @@
-// `usePageContext` allows us to access `pageContext` in any React component.
-// More infos: https://vite-plugin-ssr.com/pageContext-anywhere
-
-import React, { useContext } from "react";
-
-export { PageContextProvider };
-export { usePageContext };
-
-const Context = React.createContext(undefined);
-
-function PageContextProvider({ pageContext, children }) {
-  return <Context.Provider value={pageContext}>{children}</Context.Provider>;
-}
-
-function usePageContext() {
-  const pageContext = useContext(Context);
-  return pageContext;
-}

package/files/js/react+client-router/renderer/_default.page.client.jsx

@@ -1,43 +0,0 @@
-import ReactDOM from "react-dom";
-import React from "react";
-import { useClientRouter } from "vite-plugin-ssr/client/router";
-import { PageWrapper } from "./PageWrapper";
-
-useClientRouter({
-  async render(pageContext) {
-    if (pageContext.isHydration) {
-      // When we render the first page. (Since we do SSR, the first page is already
-      // rendered to HTML and we merely have to hydrate it.)
-      const { Page, pageProps } = pageContext;
-      ReactDOM.hydrate(
-        <PageWrapper pageContext={pageContext}>
-          <Page {...pageProps} />
-        </PageWrapper>,
-        document.getElementById("page-view")
-      );
-    } else {
-      // When the user navigates to a new page.
-      const { Page, pageProps } = pageContext;
-      ReactDOM.render(
-        <PageWrapper pageContext={pageContext}>
-          <Page {...pageProps} />
-        </PageWrapper>,
-        document.getElementById("page-view")
-      );
-    }
-  },
-
-  ensureHydration: true,
-
-  prefetchLinks: true,
-
-  onTransitionStart() {
-    // Page transition started
-  },
-
-  onTransitionEnd() {
-    // Page transition ended
-  },
-}).hydrationPromise.then(() => {
-  // Hydration finished; page is now interactive
-});

package/files/js/react+client-router/renderer/types.js

@@ -1 +0,0 @@
-export {};

package/files/js/vike/server/index.js

@@ -1,40 +0,0 @@
-const express = require("express");
-const { createPageRenderer } = require("vite-plugin-ssr");
-
-const isProduction = process.env.NODE_ENV === "production";
-const root = `${__dirname}/..`;
-
-startServer();
-
-async function startServer() {
-  const app = express();
-
-  let viteDevServer;
-  if (isProduction) {
-    app.use(express.static(`${root}/dist/client`));
-  } else {
-    const vite = require("vite");
-    viteDevServer = await vite.createServer({
-      root,
-      server: { middlewareMode: true },
-    });
-    app.use(viteDevServer.middlewares);
-  }
-
-  const renderPage = createPageRenderer({ viteDevServer, isProduction, root });
-  app.get("*", async (req, res, next) => {
-    const url = req.originalUrl;
-    const pageContextInit = {
-      url,
-    };
-    const pageContext = await renderPage(pageContextInit);
-    const { httpResponse } = pageContext;
-    if (!httpResponse) return next();
-    const { statusCode, body } = httpResponse;
-    res.status(statusCode).send(body);
-  });
-
-  const port = process.env.PORT || 3000;
-  app.listen(port);
-  console.log(`Server running at http://localhost:${port}`);
-}

package/files/js/vue/pages/about/index.page.vue

@@ -1,11 +0,0 @@
-<template>
-  <h1>About</h1>
-  <p>A colored page.</p>
-</template>
-
-<style>
-h1,
-p {
-  color: green;
-}
-</style>

package/files/js/vue/pages/index/Counter.vue

@@ -1,10 +0,0 @@
-<template>
-  <button type="button" @click="state.count++">
-    Counter {{ state.count }}
-  </button>
-</template>
-
-<script setup>
-import { reactive } from "vue";
-const state = reactive({ count: 0 });
-</script>

package/files/js/vue/renderer/_default.page.client.js

@@ -1,12 +0,0 @@
-import { getPage } from "vite-plugin-ssr/client";
-import { createApp } from "./app";
-
-hydrate();
-
-async function hydrate() {
-  // We do Server Routing, but we can also do Client Routing by using `useClientRouter()`
-  // instead of `getPage()`, see https://vite-plugin-ssr.com/useClientRouter
-  const pageContext = await getPage();
-  const app = createApp(pageContext);
-  app.mount("#app");
-}

package/files/js/vue/renderer/_default.page.server.js

@@ -1,41 +0,0 @@
-import { renderToString } from "@vue/server-renderer";
-import { escapeInject, dangerouslySkipEscape } from "vite-plugin-ssr";
-import { createApp } from "./app";
-import logoUrl from "./logo.svg";
-
-export { render };
-// See https://vite-plugin-ssr.com/data-fetching
-export const passToClient = ["pageProps", "urlPathname"];
-
-async function render(pageContext) {
-  const app = createApp(pageContext);
-  const appHtml = await renderToString(app);
-
-  // See https://vite-plugin-ssr.com/html-head
-  const { documentProps } = pageContext;
-  const title = (documentProps && documentProps.title) || "Vite SSR app";
-  const desc =
-    (documentProps && documentProps.description) ||
-    "App using Vite + vite-plugin-ssr";
-
-  const documentHtml = escapeInject`<!DOCTYPE html>
-    <html lang="en">
-      <head>
-        <meta charset="UTF-8" />
-        <link rel="icon" href="${logoUrl}" />
-        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-        <meta name="description" content="${desc}" />
-        <title>${title}</title>
-      </head>
-      <body>
-        <div id="app">${dangerouslySkipEscape(appHtml)}</div>
-      </body>
-    </html>`;
-
-  return {
-    documentHtml,
-    pageContext: {
-      // We can add some `pageContext` here, which is useful if we want to do page redirection https://vite-plugin-ssr.com/page-redirection
-    },
-  };
-}