revine 0.9.1 → 1.0.1

package/README.md

@@ -58,7 +58,7 @@ src/pages/blog/[slug].tsx → /blog/:slug
 ### Clone repository
 
 ```bash
-git clone https://github.com/your-username/revine.git
+git clone [https://github.com/your-username/revine.git](https://github.com/rachit-bharadwaj/revine)
 ```
 
 ### Install dependencies

package/dist/client.d.ts

@@ -0,0 +1,8 @@
+export { Outlet, RouterProvider, useLocation, useNavigate, useParams, useSearchParams } from "react-router-dom";
+export type { NavLinkProps } from "./components/NavLink.js";
+export { Link } from "./components/Link.js";
+export { NavLink } from "./components/NavLink.js";
+export { defineConfig } from "./runtime/defineConfig.js";
+export type { LayoutProps } from "./runtime/types.js";
+export type { LinkProps } from "./components/Link.js";
+//# sourceMappingURL=client.d.ts.map

package/dist/client.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"client.d.ts","sourceRoot":"","sources":["../src/client.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,MAAM,EACN,cAAc,EACd,WAAW,EACX,WAAW,EACX,SAAS,EACT,eAAe,EAChB,MAAM,kBAAkB,CAAC;AAC1B,YAAY,EAAE,YAAY,EAAE,MAAM,yBAAyB,CAAC;AAC5D,OAAO,EAAE,IAAI,EAAE,MAAM,sBAAsB,CAAC;AAC5C,OAAO,EAAE,OAAO,EAAE,MAAM,yBAAyB,CAAC;AAClD,OAAO,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AACzD,YAAY,EAAE,WAAW,EAAE,MAAM,oBAAoB,CAAC;AACtD,YAAY,EAAE,SAAS,EAAE,MAAM,sBAAsB,CAAC"}

package/dist/client.js

@@ -0,0 +1,4 @@
+export { Outlet, RouterProvider, useLocation, useNavigate, useParams, useSearchParams } from "react-router-dom";
+export { Link } from "./components/Link.js";
+export { NavLink } from "./components/NavLink.js";
+export { defineConfig } from "./runtime/defineConfig.js";

package/dist/components/Link.d.ts

@@ -0,0 +1,8 @@
+import type { ReactNode } from "react";
+import { type LinkProps as RouterLinkProps } from "react-router-dom";
+export interface LinkProps extends Omit<RouterLinkProps, "to"> {
+    href: string;
+    children?: ReactNode;
+}
+export declare function Link({ href, children, ...rest }: LinkProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=Link.d.ts.map

package/dist/components/Link.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Link.d.ts","sourceRoot":"","sources":["../../src/components/Link.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,EAEL,KAAK,SAAS,IAAI,eAAe,EAClC,MAAM,kBAAkB,CAAC;AAE1B,MAAM,WAAW,SAAU,SAAQ,IAAI,CAAC,eAAe,EAAE,IAAI,CAAC;IAC5D,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,wBAAgB,IAAI,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,GAAG,IAAI,EAAE,EAAE,SAAS,2CAM1D"}

package/dist/components/Link.js

@@ -0,0 +1,5 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Link as RouterLink, } from "react-router-dom";
+export function Link({ href, children, ...rest }) {
+    return (_jsx(RouterLink, { to: href, ...rest, children: children }));
+}

package/dist/components/NavLink.d.ts

@@ -0,0 +1,8 @@
+import type { ReactNode } from "react";
+import { type NavLinkProps as RouterNavLinkProps } from "react-router-dom";
+export interface NavLinkProps extends Omit<RouterNavLinkProps, "to"> {
+    href: string;
+    children?: ReactNode;
+}
+export declare function NavLink({ href, children, ...rest }: NavLinkProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=NavLink.d.ts.map

package/dist/components/NavLink.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"NavLink.d.ts","sourceRoot":"","sources":["../../src/components/NavLink.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,EAEL,KAAK,YAAY,IAAI,kBAAkB,EACxC,MAAM,kBAAkB,CAAC;AAE1B,MAAM,WAAW,YAAa,SAAQ,IAAI,CAAC,kBAAkB,EAAE,IAAI,CAAC;IAClE,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,wBAAgB,OAAO,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,GAAG,IAAI,EAAE,EAAE,YAAY,2CAMhE"}

package/dist/components/NavLink.js

@@ -0,0 +1,5 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { NavLink as RouterNavLink, } from "react-router-dom";
+export function NavLink({ href, children, ...rest }) {
+    return (_jsx(RouterNavLink, { to: href, ...rest, children: children }));
+}

package/dist/index.js

@@ -1,48 +1,55 @@
 #!/usr/bin/env node
 import { Command } from "commander";
-import { createProject } from "./commands/createProject.js";
-import { spawn } from "child_process";
+import { readFileSync } from "fs";
 import path from "path";
 import { fileURLToPath } from "url";
+import { createProject } from "./commands/createProject.js";
 const __filename = fileURLToPath(import.meta.url);
 const __dirname = path.dirname(__filename);
+const pkgPath = path.resolve(__dirname, "../package.json");
+const pkg = JSON.parse(readFileSync(pkgPath, "utf-8"));
 const program = new Command();
-// Main command handler for direct project creation
 const handleProjectCreation = async (projectName, options) => {
     await createProject(projectName, options);
 };
-// Helper to run vite with internal config
-const runViteCommand = (command) => {
-    // Path to the compiled vite.config.js in dist
+const runViteCommand = async (command) => {
     const configPath = path.resolve(__dirname, "runtime/bundler/vite.config.js");
-    const args = [command, "--config", configPath];
+    // Set the config path as env variable — vite reads VITE_CONFIG_FILE
+    process.env.VITE_CONFIG_PATH = configPath;
+    // Dynamically import vite's programmatic API
+    const vitePath = path.resolve(process.cwd(), "node_modules/vite/dist/node/index.js");
+    const vite = await import(vitePath);
+    // Load the revine config
+    const { generateRevineViteConfig } = await import(path.resolve(__dirname, "runtime/bundler/generateConfig.js"));
+    const config = await generateRevineViteConfig();
     if (command === "dev") {
-        // Vite dev doesn't need 'dev' argument, just calling vite is enough
-        args.shift();
+        const server = await vite.createServer({
+            ...config,
+            configFile: false, // we pass config directly, no file needed
+        });
+        await server.listen();
+        server.printUrls();
     }
-    spawn("npx", ["vite", ...args], {
-        stdio: "inherit",
-        shell: true,
-    });
-};
-// Main command handler for direct project creation with command check
-const handleRootAction = async (projectName, options) => {
-    const knownCommands = ["create", "dev", "build", "preview"];
-    if (projectName && !knownCommands.includes(projectName)) {
-        await handleProjectCreation(projectName, options);
+    else if (command === "build") {
+        await vite.build({
+            ...config,
+            configFile: false,
+        });
     }
-    else if (!projectName) {
-        program.help();
+    else if (command === "preview") {
+        const server = await vite.preview({
+            ...config,
+            configFile: false,
+        });
+        server.printUrls();
     }
 };
-// Root command
+// Root command — handles: npx revine <project-name>
 program
-    .version("0.8.0")
+    .version(pkg.version)
     .argument("[project-name/command]")
     .option("-f, --force", "Force creation in non-empty directory")
     .action(async (arg, options) => {
-    // If it's a known command, Commander will handle it in the subcommand action.
-    // We only handle it here if it's NOT a known command.
     const knownCommands = ["create", "dev", "build", "preview"];
     if (arg && !knownCommands.includes(arg)) {
         await handleProjectCreation(arg, options);
@@ -51,7 +58,7 @@ program
         program.help();
     }
 });
-// Create subcommand (npx revine create my-app)
+// npx revine create <project-name>
 program
     .command("create")
     .argument("<project-name>")

package/dist/runtime/bundler/defaults/vite.d.ts

@@ -10,6 +10,12 @@ export declare const defaultViteConfig: {
     build: {
         outDir: string;
         emptyOutDir: boolean;
+        rollupOptions: {
+            external: string[];
+        };
+    };
+    optimizeDeps: {
+        exclude: string[];
     };
 };
 //# sourceMappingURL=vite.d.ts.map

package/dist/runtime/bundler/defaults/vite.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"vite.d.ts","sourceRoot":"","sources":["../../../../src/runtime/bundler/defaults/vite.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,iBAAiB;;;;;;;;;;;;;CAa7B,CAAC"}
+{"version":3,"file":"vite.d.ts","sourceRoot":"","sources":["../../../../src/runtime/bundler/defaults/vite.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,iBAAiB;;;;;;;;;;;;;;;;;;;CAmB7B,CAAC"}

package/dist/runtime/bundler/defaults/vite.js

@@ -1,17 +1,23 @@
 import react from "@vitejs/plugin-react";
-import { revineLoggerPlugin } from "../viteLoggerPlugin.js";
 import { revinePlugin } from "../revinePlugin.js";
+import { revineLoggerPlugin } from "../viteLoggerPlugin.js";
 export const defaultViteConfig = {
     plugins: [react(), revinePlugin(), revineLoggerPlugin()],
     logLevel: "silent",
     server: {
         clearScreen: false,
-        open: true,
+        open: false,
         port: 3000,
         host: true,
     },
     build: {
         outDir: "build",
         emptyOutDir: true,
+        rollupOptions: {
+            external: ["revine"],
+        },
+    },
+    optimizeDeps: {
+        exclude: ["revine"],
     },
 };

package/dist/runtime/bundler/revinePlugin.d.ts

@@ -1,9 +1,2 @@
-/**
- * The Revine Vite plugin.
- *
- * Provides a virtual module for `revine/routing` so that:
- *  - `import.meta.glob` is resolved by Vite in the *project* context (not node_modules)
- *  - React runtime is resolved from the project's own node_modules
- */
 export declare function revinePlugin(): any;
 //# sourceMappingURL=revinePlugin.d.ts.map

package/dist/runtime/bundler/revinePlugin.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"revinePlugin.d.ts","sourceRoot":"","sources":["../../../src/runtime/bundler/revinePlugin.ts"],"names":[],"mappings":"AAEA;;;;;;GAMG;AAEH,wBAAgB,YAAY,IAAI,GAAG,CA4DlC"}
+{"version":3,"file":"revinePlugin.d.ts","sourceRoot":"","sources":["../../../src/runtime/bundler/revinePlugin.ts"],"names":[],"mappings":"AAEA,wBAAgB,YAAY,IAAI,GAAG,CA+GlC"}

package/dist/runtime/bundler/revinePlugin.js

@@ -1,58 +1,101 @@
 const VIRTUAL_ROUTING_ID = "\0revine:routing";
-/**
- * The Revine Vite plugin.
- *
- * Provides a virtual module for `revine/routing` so that:
- *  - `import.meta.glob` is resolved by Vite in the *project* context (not node_modules)
- *  - React runtime is resolved from the project's own node_modules
- */
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
 export function revinePlugin() {
     return {
         name: "revine",
+        enforce: "pre",
         resolveId(id) {
             if (id === "revine/routing") {
                 return VIRTUAL_ROUTING_ID;
             }
         },
-        // Return the routing source as a virtual module.
-        // Because it's virtual (not inside node_modules), Vite processes
-        // import.meta.glob and all imports normally in the project context.
         load(id) {
             if (id === VIRTUAL_ROUTING_ID) {
                 return `
 import { createBrowserRouter } from "react-router-dom";
 import { lazy, Suspense, createElement } from "react";
 
-// Eagerly load NotFound from the project's src directory.
 const notFoundModules = import.meta.glob("/src/NotFound.tsx", { eager: true });
 const NotFoundComponent = Object.values(notFoundModules)[0]?.default;
 
-// Lazily load all page components under /src/pages.
 const pages = import.meta.glob("/src/pages/**/*.tsx");
+const layoutModules = import.meta.glob("/src/pages/**/layout.tsx", { eager: true });
+const loadingModules = import.meta.glob("/src/pages/**/loading.tsx", { eager: true });
 
-const routes = Object.entries(pages).map(([filePath, component]) => {
-  let cleaned = filePath.replace(/\\\\/g, "/");
-  cleaned = cleaned.replace(/.*\\/pages\\//, "");
-  cleaned = cleaned.replace(/\\.tsx$/i, "");
-  cleaned = cleaned.replace(/\\/index$/, "");
-  cleaned = cleaned.replace(/\\[(\\w+)\\]/g, ":$1");
-  if (cleaned === "index") cleaned = "";
+function getLayoutsForPath(filePath) {
+  const parts = filePath.split("/");
+  parts.pop();
+  const layouts = [];
+  const accumulated = [];
+  for (const part of parts) {
+    accumulated.push(part);
+    const key = accumulated.join("/") + "/layout.tsx";
+    if (layoutModules[key] && layoutModules[key].default) {
+      layouts.push(layoutModules[key].default);
+    }
+  }
+  return layouts;
+}
+
+function getLoadingForPath(filePath) {
+  const parts = filePath.split("/");
+  parts.pop();
+  while (parts.length >= 2) {
+    const key = parts.join("/") + "/loading.tsx";
+    if (loadingModules[key] && loadingModules[key].default) {
+      return loadingModules[key].default;
+    }
+    parts.pop();
+  }
+  return null;
+}
 
-  const routePath = cleaned === "" ? "/" : \`/\${cleaned}\`;
+function wrapWithLayouts(element, layouts) {
+  return layouts.reduceRight((wrapped, Layout) => {
+    return createElement(Layout, null, wrapped);
+  }, element);
+}
+
+function toRoutePath(filePath) {
+  let p = filePath;
+  p = p.replace(/[\\\\]/g, "/");
+  p = p.replace(/.*[/]pages[/]/, "");
+  p = p.replace(/[.]tsx$/i, "");
+  p = p.replace(/[/]index$/, "");
+  p = p.replace(/[(][^)]+[)][/]/g, "");
+  p = p.replace(/[[]([\\w]+)[\\]]/g, ":$1");
+  if (p === "index" || p === "") return "/";
+  return "/" + p;
+}
+
+const pageEntries = Object.entries(pages).filter(([filePath]) => {
+  if (filePath.endsWith("/layout.tsx")) return false;
+  if (filePath.endsWith("/loading.tsx")) return false;
+  const segments = filePath.split("/");
+  return !segments.some((s) => s.startsWith("_"));
+});
+
+const routes = pageEntries.map(([filePath, component]) => {
+  const routePath = toRoutePath(filePath);
   const Component = lazy(component);
+  const layouts = getLayoutsForPath(filePath);
+  const Loading = getLoadingForPath(filePath);
+
+  const fallback = Loading
+    ? createElement(Loading)
+    : createElement("div", null, "Loading\\u2026");
+
+  const pageElement = createElement(
+    Suspense,
+    { fallback },
+    createElement(Component)
+  );
 
   return {
     path: routePath,
-    element: createElement(
-      Suspense,
-      { fallback: createElement("div", null, "Loading\u2026") },
-      createElement(Component)
-    ),
+    element: layouts.length > 0 ? wrapWithLayouts(pageElement, layouts) : pageElement,
   };
 });
 
-// 404 fallback
 routes.push({
   path: "*",
   element: NotFoundComponent

package/dist/runtime/bundler/viteLoggerPlugin.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"viteLoggerPlugin.d.ts","sourceRoot":"","sources":["../../../src/runtime/bundler/viteLoggerPlugin.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,MAAM,EAAiB,MAAM,MAAM,CAAC;AAGlD,wBAAgB,kBAAkB,IAAI,MAAM,CA6B3C"}
+{"version":3,"file":"viteLoggerPlugin.d.ts","sourceRoot":"","sources":["../../../src/runtime/bundler/viteLoggerPlugin.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,MAAM,EAAiB,MAAM,MAAM,CAAC;AAElD,wBAAgB,kBAAkB,IAAI,MAAM,CA8B3C"}

package/dist/runtime/bundler/viteLoggerPlugin.js

@@ -7,13 +7,13 @@ export function revineLoggerPlugin() {
         configureServer(server) {
             server.httpServer?.once("listening", () => {
                 const protocol = server.config.server.https ? "https" : "http";
-                const host = server.resolvedUrls?.local[0] || "localhost:3000";
+                const localUrl = server.resolvedUrls?.local[0] || `http://localhost:3000`;
                 const { network = [] } = server.resolvedUrls ?? {};
                 // Use the 'indigo' instance in place of 'chalk.cyan'
                 console.log(indigo("─────────────────────────────────────────────"));
                 console.log(indigo.bold("🚀 Revine Dev Server is now running!"));
                 console.log(indigo("─────────────────────────────────────────────"));
-                console.log(indigo(`Local:   ${chalk.green(`${protocol}://${host}`)}`));
+                console.log(indigo(`Local:   ${chalk.green(localUrl)}`));
                 if (network.length) {
                     network.forEach((url) => {
                         console.log(indigo(`Network: ${chalk.green(url)}`));

package/dist/runtime/defineConfig.d.ts

@@ -0,0 +1,6 @@
+import type { UserConfig } from "vite";
+export interface RevineConfig {
+    vite?: UserConfig;
+}
+export declare function defineConfig(config: RevineConfig): RevineConfig;
+//# sourceMappingURL=defineConfig.d.ts.map

package/dist/runtime/defineConfig.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"defineConfig.d.ts","sourceRoot":"","sources":["../../src/runtime/defineConfig.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,MAAM,CAAC;AAEvC,MAAM,WAAW,YAAY;IAC3B,IAAI,CAAC,EAAE,UAAU,CAAC;CACnB;AAED,wBAAgB,YAAY,CAAC,MAAM,EAAE,YAAY,GAAG,YAAY,CAE/D"}

package/dist/runtime/defineConfig.js

@@ -0,0 +1,3 @@
+export function defineConfig(config) {
+    return config;
+}

package/dist/runtime/routing.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=routing.d.ts.map

package/dist/runtime/routing.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"routing.d.ts","sourceRoot":"","sources":["../../src/runtime/routing.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,CAAC"}

package/dist/runtime/routing.js

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

package/dist/runtime/types.d.ts

@@ -0,0 +1,5 @@
+import type { ReactNode } from "react";
+export interface LayoutProps {
+    children: ReactNode;
+}
+//# sourceMappingURL=types.d.ts.map

package/dist/runtime/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/runtime/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,MAAM,WAAW,WAAW;IAC1B,QAAQ,EAAE,SAAS,CAAC;CACrB"}

package/dist/runtime/types.js

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

package/dist/setup/dependencies.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"dependencies.d.ts","sourceRoot":"","sources":["../../src/setup/dependencies.ts"],"names":[],"mappings":"AAGA,wBAAsB,mBAAmB,CAAC,UAAU,EAAE,MAAM,GAAG,OAAO,CAAC,IAAI,CAAC,CAsB3E"}
+{"version":3,"file":"dependencies.d.ts","sourceRoot":"","sources":["../../src/setup/dependencies.ts"],"names":[],"mappings":"AAGA,wBAAsB,mBAAmB,CAAC,UAAU,EAAE,MAAM,GAAG,OAAO,CAAC,IAAI,CAAC,CAc3E"}

package/dist/setup/dependencies.js

@@ -6,18 +6,11 @@ export async function installDependencies(projectDir) {
     const installResult = spawnSync(npmCmd, ["install"], {
         stdio: "inherit",
         cwd: projectDir,
-        shell: true,
+        shell: false,
     });
     if (installResult.error || installResult.status !== 0) {
         logError("Error installing dependencies:", installResult.error);
         logInfo("Try running manually: npm install");
         process.exit(1);
     }
-    // Step 2: Link local revine if available (replaces npm version with local build)
-    // This is a no-op if revine hasn't been globally linked via `npm link` in the revine repo.
-    spawnSync(npmCmd, ["link", "revine"], {
-        stdio: "pipe", // suppress output — silently skip if not linked
-        cwd: projectDir,
-        shell: true,
-    });
 }

package/package.json

@@ -1,8 +1,8 @@
 {
   "name": "revine",
-  "version": "0.9.1",
+  "version": "1.0.1",
   "description": "A react framework, but better.",
-  "license": "ISC",
+  "license": "MIT",
   "author": "Rachit Bharadwaj",
   "type": "module",
   "main": "dist/index.js",
@@ -11,28 +11,15 @@
   },
   "exports": {
     ".": {
-      "import": "./dist/index.js",
-      "types": "./dist/index.d.ts"
+      "import": "./dist/client.js",
+      "types": "./dist/client.d.ts"
     },
     "./routing": {
-      "import": "./dist/runtime/routing/fileBased.js",
-      "types": "./dist/runtime/routing/fileBased.d.ts"
-    },
-    "./bundler/*": {
-      "import": "./dist/runtime/bundler/*.js",
-      "types": "./dist/runtime/bundler/*.d.ts"
-    }
-  },
-  "typesVersions": {
-    "*": {
-      "routing": [
-        "./dist/runtime/routing/fileBased.d.ts"
-      ],
-      "bundler/*": [
-        "./dist/runtime/bundler/*.d.ts"
-      ]
+      "import": "./dist/runtime/routing.js",
+      "types": "./dist/runtime/routing.d.ts"
     }
   },
+  "typesVersions": {},
   "scripts": {
     "build": "tsc",
     "dev": "tsc -w",
@@ -42,7 +29,6 @@
     "@vitejs/plugin-react": "^4.2.1",
     "chalk": "^5.4.1",
     "commander": "^13.1.0",
-    "cross-spawn": "^7.0.6",
     "fs-extra": "^11.3.0",
     "inquirer": "^12.4.1",
     "lodash-es": "^4.17.21",

package/src/client.ts

@@ -0,0 +1,14 @@
+export {
+  Outlet,
+  RouterProvider,
+  useLocation,
+  useNavigate,
+  useParams,
+  useSearchParams
+} from "react-router-dom";
+export type { NavLinkProps } from "./components/NavLink.js"; 
+export { Link } from "./components/Link.js";
+export { NavLink } from "./components/NavLink.js";
+export { defineConfig } from "./runtime/defineConfig.js";
+export type { LayoutProps } from "./runtime/types.js";
+export type { LinkProps } from "./components/Link.js";

package/src/components/Link.tsx

@@ -0,0 +1,18 @@
+import type { ReactNode } from "react";
+import {
+  Link as RouterLink,
+  type LinkProps as RouterLinkProps,
+} from "react-router-dom";
+
+export interface LinkProps extends Omit<RouterLinkProps, "to"> {
+  href: string;
+  children?: ReactNode;
+}
+
+export function Link({ href, children, ...rest }: LinkProps) {
+  return (
+    <RouterLink to={href} {...rest}>
+      {children}
+    </RouterLink>
+  );
+}

package/src/components/NavLink.tsx

@@ -0,0 +1,18 @@
+import type { ReactNode } from "react";
+import {
+  NavLink as RouterNavLink,
+  type NavLinkProps as RouterNavLinkProps,
+} from "react-router-dom";
+
+export interface NavLinkProps extends Omit<RouterNavLinkProps, "to"> {
+  href: string;
+  children?: ReactNode;
+}
+
+export function NavLink({ href, children, ...rest }: NavLinkProps) {
+  return (
+    <RouterNavLink to={href} {...rest}>
+      {children}
+    </RouterNavLink>
+  );
+}

package/src/index.ts

@@ -1,16 +1,18 @@
 #!/usr/bin/env node
 import { Command } from "commander";
-import { createProject } from "./commands/createProject.js";
-import { spawn } from "child_process";
+import { readFileSync } from "fs";
 import path from "path";
 import { fileURLToPath } from "url";
+import { createProject } from "./commands/createProject.js";
 
 const __filename = fileURLToPath(import.meta.url);
 const __dirname = path.dirname(__filename);
 
+const pkgPath = path.resolve(__dirname, "../package.json");
+const pkg = JSON.parse(readFileSync(pkgPath, "utf-8"));
+
 const program = new Command();
 
-// Main command handler for direct project creation
 const handleProjectCreation = async (
   projectName: string,
   options: { force?: boolean },
@@ -18,44 +20,52 @@ const handleProjectCreation = async (
   await createProject(projectName, options);
 };
 
-// Helper to run vite with internal config
-const runViteCommand = (command: string) => {
-  // Path to the compiled vite.config.js in dist
+const runViteCommand = async (command: string) => {
   const configPath = path.resolve(__dirname, "runtime/bundler/vite.config.js");
 
-  const args = [command, "--config", configPath];
-  if (command === "dev") {
-    // Vite dev doesn't need 'dev' argument, just calling vite is enough
-    args.shift();
-  }
+  // Set the config path as env variable — vite reads VITE_CONFIG_FILE
+  process.env.VITE_CONFIG_PATH = configPath;
 
-  spawn("npx", ["vite", ...args], {
-    stdio: "inherit",
-    shell: true,
-  });
-};
+  // Dynamically import vite's programmatic API
+  const vitePath = path.resolve(
+    process.cwd(),
+    "node_modules/vite/dist/node/index.js",
+  );
+  const vite = await import(vitePath);
 
-// Main command handler for direct project creation with command check
-const handleRootAction = async (
-  projectName: string | undefined,
-  options: { force?: boolean },
-) => {
-  const knownCommands = ["create", "dev", "build", "preview"];
-  if (projectName && !knownCommands.includes(projectName)) {
-    await handleProjectCreation(projectName, options);
-  } else if (!projectName) {
-    program.help();
+  // Load the revine config
+  const { generateRevineViteConfig } = await import(
+    path.resolve(__dirname, "runtime/bundler/generateConfig.js")
+  );
+  const config = await generateRevineViteConfig();
+
+  if (command === "dev") {
+    const server = await vite.createServer({
+      ...config,
+      configFile: false, // we pass config directly, no file needed
+    });
+    await server.listen();
+    server.printUrls();
+  } else if (command === "build") {
+    await vite.build({
+      ...config,
+      configFile: false,
+    });
+  } else if (command === "preview") {
+    const server = await vite.preview({
+      ...config,
+      configFile: false,
+    });
+    server.printUrls();
   }
 };
 
-// Root command
+// Root command — handles: npx revine <project-name>
 program
-  .version("0.8.0")
+  .version(pkg.version)
   .argument("[project-name/command]")
   .option("-f, --force", "Force creation in non-empty directory")
   .action(async (arg: string | undefined, options: { force?: boolean }) => {
-    // If it's a known command, Commander will handle it in the subcommand action.
-    // We only handle it here if it's NOT a known command.
     const knownCommands = ["create", "dev", "build", "preview"];
     if (arg && !knownCommands.includes(arg)) {
       await handleProjectCreation(arg, options);
@@ -64,7 +74,7 @@ program
     }
   });
 
-// Create subcommand (npx revine create my-app)
+// npx revine create <project-name>
 program
   .command("create")
   .argument("<project-name>")

package/src/runtime/bundler/defaults/vite.ts

@@ -1,18 +1,24 @@
 import react from "@vitejs/plugin-react";
-import { revineLoggerPlugin } from "../viteLoggerPlugin.js";
 import { revinePlugin } from "../revinePlugin.js";
+import { revineLoggerPlugin } from "../viteLoggerPlugin.js";
 
 export const defaultViteConfig = {
   plugins: [react(), revinePlugin(), revineLoggerPlugin()],
   logLevel: "silent",
   server: {
     clearScreen: false,
-    open: true,
+    open: false,
     port: 3000,
     host: true,
   },
   build: {
     outDir: "build",
     emptyOutDir: true,
+    rollupOptions: {
+      external: ["revine"],
+    },
+  },
+  optimizeDeps: {
+    exclude: ["revine"],
   },
 };

package/src/runtime/bundler/revinePlugin.ts

@@ -1,16 +1,9 @@
 const VIRTUAL_ROUTING_ID = "\0revine:routing";
 
-/**
- * The Revine Vite plugin.
- *
- * Provides a virtual module for `revine/routing` so that:
- *  - `import.meta.glob` is resolved by Vite in the *project* context (not node_modules)
- *  - React runtime is resolved from the project's own node_modules
- */
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
 export function revinePlugin(): any {
   return {
     name: "revine",
+    enforce: "pre",
 
     resolveId(id: string) {
       if (id === "revine/routing") {
@@ -18,44 +11,94 @@ export function revinePlugin(): any {
       }
     },
 
-    // Return the routing source as a virtual module.
-    // Because it's virtual (not inside node_modules), Vite processes
-    // import.meta.glob and all imports normally in the project context.
     load(id: string) {
       if (id === VIRTUAL_ROUTING_ID) {
         return `
 import { createBrowserRouter } from "react-router-dom";
 import { lazy, Suspense, createElement } from "react";
 
-// Eagerly load NotFound from the project's src directory.
 const notFoundModules = import.meta.glob("/src/NotFound.tsx", { eager: true });
 const NotFoundComponent = Object.values(notFoundModules)[0]?.default;
 
-// Lazily load all page components under /src/pages.
 const pages = import.meta.glob("/src/pages/**/*.tsx");
+const layoutModules = import.meta.glob("/src/pages/**/layout.tsx", { eager: true });
+const loadingModules = import.meta.glob("/src/pages/**/loading.tsx", { eager: true });
 
-const routes = Object.entries(pages).map(([filePath, component]) => {
-  let cleaned = filePath.replace(/\\\\/g, "/");
-  cleaned = cleaned.replace(/.*\\/pages\\//, "");
-  cleaned = cleaned.replace(/\\.tsx$/i, "");
-  cleaned = cleaned.replace(/\\/index$/, "");
-  cleaned = cleaned.replace(/\\[(\\w+)\\]/g, ":$1");
-  if (cleaned === "index") cleaned = "";
+function getLayoutsForPath(filePath) {
+  const parts = filePath.split("/");
+  parts.pop();
+  const layouts = [];
+  const accumulated = [];
+  for (const part of parts) {
+    accumulated.push(part);
+    const key = accumulated.join("/") + "/layout.tsx";
+    if (layoutModules[key] && layoutModules[key].default) {
+      layouts.push(layoutModules[key].default);
+    }
+  }
+  return layouts;
+}
+
+function getLoadingForPath(filePath) {
+  const parts = filePath.split("/");
+  parts.pop();
+  while (parts.length >= 2) {
+    const key = parts.join("/") + "/loading.tsx";
+    if (loadingModules[key] && loadingModules[key].default) {
+      return loadingModules[key].default;
+    }
+    parts.pop();
+  }
+  return null;
+}
+
+function wrapWithLayouts(element, layouts) {
+  return layouts.reduceRight((wrapped, Layout) => {
+    return createElement(Layout, null, wrapped);
+  }, element);
+}
+
+function toRoutePath(filePath) {
+  let p = filePath;
+  p = p.replace(/[\\\\]/g, "/");
+  p = p.replace(/.*[/]pages[/]/, "");
+  p = p.replace(/[.]tsx$/i, "");
+  p = p.replace(/[/]index$/, "");
+  p = p.replace(/[(][^)]+[)][/]/g, "");
+  p = p.replace(/[[]([\\w]+)[\\]]/g, ":$1");
+  if (p === "index" || p === "") return "/";
+  return "/" + p;
+}
+
+const pageEntries = Object.entries(pages).filter(([filePath]) => {
+  if (filePath.endsWith("/layout.tsx")) return false;
+  if (filePath.endsWith("/loading.tsx")) return false;
+  const segments = filePath.split("/");
+  return !segments.some((s) => s.startsWith("_"));
+});
 
-  const routePath = cleaned === "" ? "/" : \`/\${cleaned}\`;
+const routes = pageEntries.map(([filePath, component]) => {
+  const routePath = toRoutePath(filePath);
   const Component = lazy(component);
+  const layouts = getLayoutsForPath(filePath);
+  const Loading = getLoadingForPath(filePath);
+
+  const fallback = Loading
+    ? createElement(Loading)
+    : createElement("div", null, "Loading\\u2026");
+
+  const pageElement = createElement(
+    Suspense,
+    { fallback },
+    createElement(Component)
+  );
 
   return {
     path: routePath,
-    element: createElement(
-      Suspense,
-      { fallback: createElement("div", null, "Loading\u2026") },
-      createElement(Component)
-    ),
+    element: layouts.length > 0 ? wrapWithLayouts(pageElement, layouts) : pageElement,
   };
 });
 
-// 404 fallback
 routes.push({
   path: "*",
   element: NotFoundComponent
@@ -68,4 +111,4 @@ export const router = createBrowserRouter(routes);
       }
     },
   };
-}
+}

package/src/runtime/bundler/viteLoggerPlugin.ts

@@ -1,5 +1,5 @@
-import type { Plugin, ViteDevServer } from "vite";
 import chalk from "chalk";
+import type { Plugin, ViteDevServer } from "vite";
 
 export function revineLoggerPlugin(): Plugin {
   //  custom chalk instance pointing to the indigo color
@@ -10,14 +10,15 @@ export function revineLoggerPlugin(): Plugin {
     configureServer(server: ViteDevServer) {
       server.httpServer?.once("listening", () => {
         const protocol = server.config.server.https ? "https" : "http";
-        const host = server.resolvedUrls?.local[0] || "localhost:3000";
+        const localUrl =
+          server.resolvedUrls?.local[0] || `http://localhost:3000`;
         const { network = [] } = server.resolvedUrls ?? {};
 
         // Use the 'indigo' instance in place of 'chalk.cyan'
         console.log(indigo("─────────────────────────────────────────────"));
         console.log(indigo.bold("🚀 Revine Dev Server is now running!"));
         console.log(indigo("─────────────────────────────────────────────"));
-        console.log(indigo(`Local:   ${chalk.green(`${protocol}://${host}`)}`));
+        console.log(indigo(`Local:   ${chalk.green(localUrl)}`));
 
         if (network.length) {
           network.forEach((url: string) => {

package/src/runtime/defineConfig.ts

@@ -0,0 +1,9 @@
+import type { UserConfig } from "vite";
+
+export interface RevineConfig {
+  vite?: UserConfig;
+}
+
+export function defineConfig(config: RevineConfig): RevineConfig {
+  return config;
+}

package/src/runtime/routing.ts

@@ -0,0 +1,4 @@
+// This module is intentionally empty.
+// `revine/routing` is a virtual module resolved by the Revine Vite plugin at build time.
+// The actual router is injected via the plugin's resolveId/load hooks.
+export {};

package/src/runtime/types.ts

@@ -0,0 +1,5 @@
+import type { ReactNode } from "react";
+
+export interface LayoutProps {
+  children: ReactNode;
+}

package/src/setup/dependencies.ts

@@ -8,19 +8,11 @@ export async function installDependencies(projectDir: string): Promise<void> {
   const installResult = spawnSync(npmCmd, ["install"], {
     stdio: "inherit",
     cwd: projectDir,
-    shell: true,
+    shell: false,
   });
   if (installResult.error || installResult.status !== 0) {
     logError("Error installing dependencies:", installResult.error);
     logInfo("Try running manually: npm install");
     process.exit(1);
   }
-
-  // Step 2: Link local revine if available (replaces npm version with local build)
-  // This is a no-op if revine hasn't been globally linked via `npm link` in the revine repo.
-  spawnSync(npmCmd, ["link", "revine"], {
-    stdio: "pipe", // suppress output — silently skip if not linked
-    cwd: projectDir,
-    shell: true,
-  });
 }

package/template/package.json

@@ -10,8 +10,7 @@
   "dependencies": {
     "revine": "latest",
     "react": "^18.2.0",
-    "react-dom": "^18.2.0",
-    "react-router-dom": "^6.22.3"
+    "react-dom": "^18.2.0"
   },
   "devDependencies": {
     "@types/react": "^18.2.45",

package/template/revine.config.ts

@@ -1,4 +1,6 @@
-export default {
+import { defineConfig } from "revine";
+
+export default defineConfig({
   vite: {
     server: {
       open: false,
@@ -10,4 +12,4 @@ export default {
       emptyOutDir: true,
     },
   },
-};
+});

package/template/src/pages/index.tsx

@@ -1,3 +1,5 @@
+import { Link } from "revine";
+
 export default function HomePage() {
   return (
     <main>
@@ -11,51 +13,51 @@ export default function HomePage() {
 
       {/* CTA Buttons */}
       <div className="cta">
-        <a href="#get-started" className="primary-btn">
+        <Link href="#get-started" className="primary-btn">
           Get Started
-        </a>
-        <a href="#docs" className="secondary-btn">
+        </Link>
+        <Link href="#docs" className="secondary-btn">
           Read Docs
-        </a>
+        </Link>
       </div>
 
       {/* Features Section */}
       <div className="features">
-        <a href="#fast">
+        <Link href="#fast">
           <h3>Lightning Fast</h3>
           <p>Built on Vite for ultra-fast development and instant HMR.</p>
-        </a>
-        <a href="#routing">
+        </Link>
+        <Link href="#routing">
           <h3>Simple File-based Routing</h3>
           <p>
             Create pages in <code>src/pages</code> and Revine will handle the
             rest.
           </p>
-        </a>
-        <a href="#tailwind">
+        </Link>
+        <Link href="#tailwind">
           <h3>Tailwind Integration</h3>
           <p>
             Pre-configured for Tailwind CSS, so you can style quickly and
             easily.
           </p>
-        </a>
-        <a href="#dev-experience">
+        </Link>
+        <Link href="#dev-experience">
           <h3>Great DX</h3>
           <p>Minimal config, fast builds, custom logging, and more.</p>
-        </a>
-        <a href="#abstract">
+        </Link>
+        <Link href="#abstract">
           <h3>Abstracted Internals</h3>
           <p>
             A .revine folder houses the complex Vite config. Keep your root
             clean.
           </p>
-        </a>
-        <a href="#customize">
+        </Link>
+        <Link href="#customize">
           <h3>Fully Customizable</h3>
           <p>
             Easily extend or override settings in <code>revine.config.ts</code>.
           </p>
-        </a>
+        </Link>
       </div>
     </main>
   );

package/template/src/root.tsx

@@ -1,6 +1,6 @@
 import React from "react";
 import { createRoot } from "react-dom/client";
-import { RouterProvider } from "react-router-dom";
+import { RouterProvider } from "revine";
 import { router } from "revine/routing";
 import "./styles/global.css";
 
@@ -11,4 +11,4 @@ root.render(
   <React.StrictMode>
     <RouterProvider router={router} />
   </React.StrictMode>,
-);
+);

package/tsconfig.json

@@ -2,7 +2,8 @@
   "compilerOptions": {
     "target": "ES2020",
     "module": "ES2020",
-    "moduleResolution": "node",
+    "moduleResolution": "bundler",
+    "rootDir": "src",
     "outDir": "dist",
     "strict": true,
     "esModuleInterop": true,
@@ -11,7 +12,8 @@
     "jsx": "react-jsx",
     "declaration": true,
     "declarationMap": true,
-    "emitDeclarationOnly": false
+    "emitDeclarationOnly": false,
+    "resolveJsonModule": true
   },
   "include": ["src/**/*"],
   "exclude": ["src/template/**/*"]

package/dist/runtime/routing/fileBased.d.ts

@@ -1,2 +0,0 @@
-export declare const router: import("@remix-run/router").Router;
-//# sourceMappingURL=fileBased.d.ts.map

package/dist/runtime/routing/fileBased.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"fileBased.d.ts","sourceRoot":"","sources":["../../../src/runtime/routing/fileBased.tsx"],"names":[],"mappings":"AA6CA,eAAO,MAAM,MAAM,oCAA8B,CAAC"}

package/dist/runtime/routing/fileBased.js

@@ -1,29 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { createBrowserRouter } from "react-router-dom";
-import { lazy, Suspense } from "react";
-// @ts-ignore
-import NotFound from "/src/NotFound";
-// @ts-ignore
-const pages = import.meta.glob("/src/pages/**/*.tsx");
-const routes = Object.entries(pages).map(([filePath, component]) => {
-    let cleaned = filePath.replace(/\\/g, "/");
-    cleaned = cleaned.replace(/.*\/pages\//, "");
-    cleaned = cleaned.replace(/\.tsx$/i, "");
-    cleaned = cleaned.replace(/\/index$/, "");
-    cleaned = cleaned.replace(/\[(\w+)\]/g, ":$1");
-    if (cleaned === "index") {
-        cleaned = "";
-    }
-    const routePath = cleaned === "" ? "/" : `/${cleaned}`;
-    const Component = lazy(component);
-    return {
-        path: routePath,
-        element: (_jsx(Suspense, { fallback: _jsx("div", { children: "Loading..." }), children: _jsx(Component, {}) })),
-    };
-});
-// fallback route for 404s
-routes.push({
-    path: "*",
-    element: _jsx(NotFound, {}),
-});
-export const router = createBrowserRouter(routes);

package/src/runtime/routing/fileBased.tsx

@@ -1,46 +0,0 @@
-import { createBrowserRouter } from "react-router-dom";
-import { lazy, Suspense, ComponentType } from "react";
-// @ts-ignore
-import NotFound from "/src/NotFound";
-
-// @ts-ignore
-const pages = import.meta.glob("/src/pages/**/*.tsx");
-
-const routes = Object.entries(pages).map(([filePath, component]) => {
-  let cleaned = filePath.replace(/\\/g, "/");
-
-  cleaned = cleaned.replace(/.*\/pages\//, "");
-
-  cleaned = cleaned.replace(/\.tsx$/i, "");
-
-  cleaned = cleaned.replace(/\/index$/, "");
-
-  cleaned = cleaned.replace(/\[(\w+)\]/g, ":$1");
-
-  if (cleaned === "index") {
-    cleaned = "";
-  }
-
-  const routePath = cleaned === "" ? "/" : `/${cleaned}`;
-
-  const Component = lazy(
-    component as unknown as () => Promise<{ default: ComponentType }>
-  );
-
-  return {
-    path: routePath,
-    element: (
-      <Suspense fallback={<div>Loading...</div>}>
-        <Component />
-      </Suspense>
-    ),
-  };
-});
-
-// fallback route for 404s
-routes.push({
-  path: "*",
-  element: <NotFound />,
-});
-
-export const router = createBrowserRouter(routes);