revine 0.8.0 → 0.9.0

package/dist/setup/tailwind.js

@@ -1,151 +1,146 @@
 import path from "path";
 import fs from "fs-extra";
-import { updateViteConfig } from "../config/vite.js";
 import { logInfo } from "../utils/logger.js";
 export async function setupTailwind(projectDir) {
     logInfo("\nSetting up Tailwind CSS...");
-    // Point to the hidden Vite config
-    const viteConfigPath = path.join(projectDir, ".revine", "bundler", "defaults", "vite.ts");
-    // Use existing updateViteConfig logic on this new path
-    await updateViteConfig(viteConfigPath);
     // Write the Tailwind CSS import into the existing global.css file
     const cssFile = path.join(projectDir, "src", "styles", "global.css");
     const cssFileContent = `@import 'tailwindcss';\n`;
     await fs.writeFile(cssFile, cssFileContent);
     // Update the starter file for Tailwind classes
     const starterFile = path.join(projectDir, "src", "pages", "index.tsx");
-    const starterFileContent = `
-export default function HomePage() {
-  return (
-    <main className="flex min-h-screen flex-col items-center justify-center p-6 bg-gradient-to-b from-white via-white to-indigo-200">
-      {/* Hero Section */}
-      <div className="max-w-screen-lg w-full text-center space-y-6">
-        <h1 className="text-4xl sm:text-6xl font-extrabold text-gray-900 tracking-tight leading-tight">
-          Welcome to{" "}
-          <span className="text-transparent bg-clip-text bg-gradient-to-r from-indigo-500 via-indigo-600 to-black">
-            Revine
-          </span>
-        </h1>
-        <p className="text-xl sm:text-2xl text-gray-600 font-light">
-          The modern, powerful, and streamlined React framework.
-        </p>
-      </div>
-
-      {/* CTA Buttons */}
-      <div className="mt-8 flex space-x-4">
-        <a
-          href="#get-started"
-          className="rounded-md bg-indigo-600 px-6 py-3 text-white font-semibold shadow-md hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2 transition-colors"
-        >
-          Get Started
-        </a>
-        <a
-          href="#docs"
-          className="rounded-md bg-white px-6 py-3 text-indigo-600 font-semibold border border-indigo-200 shadow hover:bg-gray-100 transition-colors focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2"
-        >
-          Read Docs
-        </a>
-      </div>
-
-      {/* Features Section */}
-      <div className="mt-12 grid gap-6 sm:grid-cols-2 lg:grid-cols-3 max-w-screen-lg w-full">
-        <a
-          href="#fast"
-          className="block rounded-xl border border-gray-200 bg-white p-6 shadow transition hover:shadow-xl hover:-translate-y-1"
-        >
-          <h3 className="text-lg font-semibold text-gray-900 mb-2">
-            Lightning Fast
-          </h3>
-          <p className="text-gray-600">
-            Built on Vite for ultra-fast development and instant HMR.
-          </p>
-        </a>
-
-        <a
-          href="#routing"
-          className="block rounded-xl border border-gray-200 bg-white p-6 shadow transition hover:shadow-xl hover:-translate-y-1"
-        >
-          <h3 className="text-lg font-semibold text-gray-900 mb-2">
-            Simple File-based Routing
-          </h3>
-          <p className="text-gray-600">
-            Create pages in <code>src/pages</code> and Revine will handle the
-            rest.
-          </p>
-        </a>
-
-        <a
-          href="#tailwind"
-          className="block rounded-xl border border-gray-200 bg-white p-6 shadow transition hover:shadow-xl hover:-translate-y-1"
-        >
-          <h3 className="text-lg font-semibold text-gray-900 mb-2">
-            Tailwind Integration
-          </h3>
-          <p className="text-gray-600">
-            Pre-configured for Tailwind CSS, so you can style quickly and
-            easily.
-          </p>
-        </a>
-
-        <a
-          href="#dev-experience"
-          className="block rounded-xl border border-gray-200 bg-white p-6 shadow transition hover:shadow-xl hover:-translate-y-1"
-        >
-          <h3 className="text-lg font-semibold text-gray-900 mb-2">Great DX</h3>
-          <p className="text-gray-600">
-            Minimal config, fast builds, custom logging, and more.
-          </p>
-        </a>
-
-        <a
-          href="#abstract"
-          className="block rounded-xl border border-gray-200 bg-white p-6 shadow transition hover:shadow-xl hover:-translate-y-1"
-        >
-          <h3 className="text-lg font-semibold text-gray-900 mb-2">
-            Abstracted Internals
-          </h3>
-          <p className="text-gray-600">
-            A .revine folder houses the complex Vite config. Keep your root
-            clean.
-          </p>
-        </a>
-
-        <a
-          href="#customize"
-          className="block rounded-xl border border-gray-200 bg-white p-6 shadow transition hover:shadow-xl hover:-translate-y-1"
-        >
-          <h3 className="text-lg font-semibold text-gray-900 mb-2">
-            Fully Customizable
-          </h3>
-          <p className="text-gray-600">
-            Easily extend or override settings in <code>revine.config.ts</code>.
-          </p>
-        </a>
-      </div>
-    </main>
-  );
-}
+    const starterFileContent = `
+export default function HomePage() {
+  return (
+    <main className="flex min-h-screen flex-col items-center justify-center p-6 bg-gradient-to-b from-white via-white to-indigo-200">
+      {/* Hero Section */}
+      <div className="max-w-screen-lg w-full text-center space-y-6">
+        <h1 className="text-4xl sm:text-6xl font-extrabold text-gray-900 tracking-tight leading-tight">
+          Welcome to{" "}
+          <span className="text-transparent bg-clip-text bg-gradient-to-r from-indigo-500 via-indigo-600 to-black">
+            Revine
+          </span>
+        </h1>
+        <p className="text-xl sm:text-2xl text-gray-600 font-light">
+          The modern, powerful, and streamlined React framework.
+        </p>
+      </div>
+
+      {/* CTA Buttons */}
+      <div className="mt-8 flex space-x-4">
+        <a
+          href="#get-started"
+          className="rounded-md bg-indigo-600 px-6 py-3 text-white font-semibold shadow-md hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2 transition-colors"
+        >
+          Get Started
+        </a>
+        <a
+          href="#docs"
+          className="rounded-md bg-white px-6 py-3 text-indigo-600 font-semibold border border-indigo-200 shadow hover:bg-gray-100 transition-colors focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2"
+        >
+          Read Docs
+        </a>
+      </div>
+
+      {/* Features Section */}
+      <div className="mt-12 grid gap-6 sm:grid-cols-2 lg:grid-cols-3 max-w-screen-lg w-full">
+        <a
+          href="#fast"
+          className="block rounded-xl border border-gray-200 bg-white p-6 shadow transition hover:shadow-xl hover:-translate-y-1"
+        >
+          <h3 className="text-lg font-semibold text-gray-900 mb-2">
+            Lightning Fast
+          </h3>
+          <p className="text-gray-600">
+            Built on Vite for ultra-fast development and instant HMR.
+          </p>
+        </a>
+
+        <a
+          href="#routing"
+          className="block rounded-xl border border-gray-200 bg-white p-6 shadow transition hover:shadow-xl hover:-translate-y-1"
+        >
+          <h3 className="text-lg font-semibold text-gray-900 mb-2">
+            Simple File-based Routing
+          </h3>
+          <p className="text-gray-600">
+            Create pages in <code>src/pages</code> and Revine will handle the
+            rest.
+          </p>
+        </a>
+
+        <a
+          href="#tailwind"
+          className="block rounded-xl border border-gray-200 bg-white p-6 shadow transition hover:shadow-xl hover:-translate-y-1"
+        >
+          <h3 className="text-lg font-semibold text-gray-900 mb-2">
+            Tailwind Integration
+          </h3>
+          <p className="text-gray-600">
+            Pre-configured for Tailwind CSS, so you can style quickly and
+            easily.
+          </p>
+        </a>
+
+        <a
+          href="#dev-experience"
+          className="block rounded-xl border border-gray-200 bg-white p-6 shadow transition hover:shadow-xl hover:-translate-y-1"
+        >
+          <h3 className="text-lg font-semibold text-gray-900 mb-2">Great DX</h3>
+          <p className="text-gray-600">
+            Minimal config, fast builds, custom logging, and more.
+          </p>
+        </a>
+
+        <a
+          href="#abstract"
+          className="block rounded-xl border border-gray-200 bg-white p-6 shadow transition hover:shadow-xl hover:-translate-y-1"
+        >
+          <h3 className="text-lg font-semibold text-gray-900 mb-2">
+            Abstracted Internals
+          </h3>
+          <p className="text-gray-600">
+            A .revine folder houses the complex Vite config. Keep your root
+            clean.
+          </p>
+        </a>
+
+        <a
+          href="#customize"
+          className="block rounded-xl border border-gray-200 bg-white p-6 shadow transition hover:shadow-xl hover:-translate-y-1"
+        >
+          <h3 className="text-lg font-semibold text-gray-900 mb-2">
+            Fully Customizable
+          </h3>
+          <p className="text-gray-600">
+            Easily extend or override settings in <code>revine.config.ts</code>.
+          </p>
+        </a>
+      </div>
+    </main>
+  );
+}
   `;
     await fs.writeFile(starterFile, starterFileContent);
     // Replace the NotFound.tsx content
     const notFoundFile = path.join(projectDir, "src", "NotFound.tsx");
-    const notFoundContent = `
-   export default function NotFound() {
-     return (
-       <div className="min-h-screen flex items-center justify-center bg-gray-100">
-         <div className="text-center space-y-4">
-           <h1 className="text-6xl font-bold text-gray-900">404</h1>
-           <p className="text-xl text-gray-600">Page Not Found</p>
-           <a
-             href="/"
-             className="mt-6 inline-block bg-indigo-600 text-white font-semibold px-6 py-3 rounded-md shadow hover:bg-indigo-700"
-           >
-             Go Back Home
-           </a>
-         </div>
-       </div>
-     );
-   }
+    const notFoundContent = `
+   export default function NotFound() {
+     return (
+       <div className="min-h-screen flex items-center justify-center bg-gray-100">
+         <div className="text-center space-y-4">
+           <h1 className="text-6xl font-bold text-gray-900">404</h1>
+           <p className="text-xl text-gray-600">Page Not Found</p>
+           <a
+             href="/"
+             className="mt-6 inline-block bg-indigo-600 text-white font-semibold px-6 py-3 rounded-md shadow hover:bg-indigo-700"
+           >
+             Go Back Home
+           </a>
+         </div>
+       </div>
+     );
+   }
    `;
     await fs.writeFile(notFoundFile, notFoundContent);
 }

package/package.json

@@ -1,29 +1,44 @@
-{
-  "name": "revine",
-  "version": "0.8.0",
-  "description": "A react framework, but better.",
-  "license": "ISC",
-  "author": "Rachit Bharadwaj",
-  "type": "module",
-  "main": "dist/index.js",
-  "bin": {
-    "revine": "dist/index.js"
-  },
-  "scripts": {
-    "build": "tsc",
-    "dev": "tsc -w",
-    "prepublishOnly": "npm run build"
-  },
-  "dependencies": {
-    "chalk": "^5.4.1",
-    "commander": "^13.1.0",
-    "cross-spawn": "^7.0.6",
-    "fs-extra": "^11.3.0",
-    "inquirer": "^12.4.1"
-  },
-  "devDependencies": {
-    "@types/fs-extra": "^11.0.4",
-    "@types/node": "^22.13.0",
-    "typescript": "^5.7.3"
-  }
-}
+{
+  "name": "revine",
+  "version": "0.9.0",
+  "description": "A react framework, but better.",
+  "license": "ISC",
+  "author": "Rachit Bharadwaj",
+  "type": "module",
+  "main": "dist/index.js",
+  "bin": {
+    "revine": "dist/index.js"
+  },
+  "exports": {
+    ".": "./dist/index.js",
+    "./routing": "./dist/runtime/routing/fileBased.js",
+    "./bundler/*": "./dist/runtime/bundler/*.js"
+  },
+  "scripts": {
+    "build": "tsc",
+    "dev": "tsc -w",
+    "prepublishOnly": "npm run build"
+  },
+  "dependencies": {
+    "@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",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "react-router-dom": "^6.22.3",
+    "vite": "^5.0.12"
+  },
+  "devDependencies": {
+    "@tailwindcss/vite": "^4.2.0",
+    "@types/fs-extra": "^11.0.4",
+    "@types/lodash-es": "^4.17.9",
+    "@types/node": "^22.13.0",
+    "@types/react": "^18.2.45",
+    "@types/react-dom": "^18.2.18",
+    "typescript": "^5.7.3"
+  }
+}

package/src/commands/createProject.ts

@@ -1,65 +1,88 @@
-import path from "path";
-import { fileURLToPath } from "url";
-import { updatePackageJson } from "../config/package.js";
-import { updateReadme } from "../config/readme.js";
-import { askForTailwindSetup, initGit, runProject } from "../prompts/index.js";
-import { installDependencies } from "../setup/dependencies.js";
-import { setupTailwind } from "../setup/tailwind.js";
-import { copyTemplate } from "../utils/file.js";
-import { logError, logInfo } from "../utils/logger.js";
-
-const __filename = fileURLToPath(import.meta.url);
-const __dirname = path.dirname(__filename);
-
-export async function createProject(
-  projectName: string,
-  options: { force?: boolean }
-) {
-  // Calculate directories. This uses "../../template" for your template folder.
-  const templateDir = path.join(__dirname, "../../template");
-  const projectDir = path.resolve(projectName);
-  const isCurrentDir = [".", "./"].includes(projectName);
-
-  try {
-    logInfo(`Creating project in ${projectDir}...`);
-    // This copies everything, including hidden directories like .revine
-    await copyTemplate(templateDir, projectDir, options.force);
-
-    // Derive final project name
-    const finalProjectName = isCurrentDir
-      ? path.basename(projectDir)
-      : projectName;
-
-    // Update package.json (e.g., set name, set "type": "module", add Tailwind deps if chosen)
-    const packageJsonPath = path.join(projectDir, "package.json");
-    const useTailwind = await askForTailwindSetup();
-    await updatePackageJson(packageJsonPath, finalProjectName, { useTailwind });
-
-    // Update README with the project name
-    const readmePath = path.join(projectDir, "README.md");
-    await updateReadme(readmePath, finalProjectName);
-
-    // Install dependencies
-    logInfo("\nInstalling dependencies...");
-    await installDependencies(projectDir);
-
-    // If Tailwind is selected, set it up
-    if (useTailwind) {
-      await setupTailwind(projectDir);
-    }
-
-    logInfo(`\nSuccess! Created project at ${projectDir}`);
-    logInfo("\nStart developing with:");
-    if (!isCurrentDir) console.log(`  cd ${projectName}`);
-    console.log("  npm run dev\n");
-
-    // Check if Git exists and initialize repository if user agrees
-    await initGit(projectDir);
-
-    // Prompt to run project
-    await runProject(projectDir);
-  } catch (error) {
-    logError("Error during project creation:", error);
-    process.exit(1);
-  }
-}
+import path from "path";
+import { fileURLToPath } from "url";
+import fs from "fs-extra";
+import { updatePackageJson } from "../config/package.js";
+import { updateReadme } from "../config/readme.js";
+import { askForTailwindSetup, initGit, runProject } from "../prompts/index.js";
+import { installDependencies } from "../setup/dependencies.js";
+import { setupTailwind } from "../setup/tailwind.js";
+import { copyTemplate } from "../utils/file.js";
+import { logError, logInfo } from "../utils/logger.js";
+
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = path.dirname(__filename);
+
+export async function createProject(
+  projectName: string,
+  options: { force?: boolean }
+) {
+  // Calculate directories. This uses "../../template" for your template folder.
+  const templateDir = path.join(__dirname, "../../template");
+  const projectDir = path.resolve(projectName);
+  const isCurrentDir = [".", "./"].includes(projectName);
+
+  try {
+    logInfo(`Creating project in ${projectDir}...`);
+    
+    // Ensure the project directory exists
+    await fs.ensureDir(projectDir);
+    
+    // This copies everything, including hidden directories like .revine
+    await copyTemplate(templateDir, projectDir, options.force);
+
+    // Derive final project name
+    const finalProjectName = isCurrentDir
+      ? path.basename(projectDir)
+      : projectName;
+
+    // Check if package.json exists after template copy
+    const packageJsonPath = path.join(projectDir, "package.json");
+    
+    // Create basic package.json if it doesn't exist
+    if (!await fs.pathExists(packageJsonPath)) {
+      const basicPackageJson = {
+        name: finalProjectName,
+        version: "0.1.0",
+        private: true,
+        type: "module"
+      };
+      await fs.writeJSON(packageJsonPath, basicPackageJson, { spaces: 2 });
+    }
+    
+    // Update package.json with the correct details
+    const useTailwind = await askForTailwindSetup();
+    await updatePackageJson(packageJsonPath, finalProjectName, { useTailwind });
+
+    // Check if README exists, create it if it doesn't
+    const readmePath = path.join(projectDir, "README.md");
+    if (!await fs.pathExists(readmePath)) {
+      await fs.writeFile(readmePath, `# ${finalProjectName}\n\nCreated with Revine`);
+    }
+    
+    // Update README with the project name
+    await updateReadme(readmePath, finalProjectName);
+
+    // Install dependencies
+    logInfo("\nInstalling dependencies...");
+    await installDependencies(projectDir);
+
+    // If Tailwind is selected, set it up
+    if (useTailwind) {
+      await setupTailwind(projectDir);
+    }
+
+    logInfo(`\nSuccess! Created project at ${projectDir}`);
+    logInfo("\nStart developing with:");
+    if (!isCurrentDir) console.log(`  cd ${projectName}`);
+    console.log("  npm run dev\n");
+
+    // Check if Git exists and initialize repository if user agrees
+    await initGit(projectDir);
+
+    // Prompt to run project
+    await runProject(projectDir);
+  } catch (error) {
+    logError("Error during project creation:", error);
+    process.exit(1);
+  }
+}

package/src/config/package.ts

@@ -1,23 +1,28 @@
-import fs from "fs-extra";
-
-interface UpdatePackageOptions {
-  useTailwind?: boolean;
-}
-
-export async function updatePackageJson(
-  filePath: string,
-  projectName: string,
-  options: UpdatePackageOptions = {}
-) {
-  const packageJson = await fs.readJson(filePath);
-  packageJson.name = projectName;
-  packageJson.type = "module";
-  if (options.useTailwind) {
-    packageJson.devDependencies = {
-      ...packageJson.devDependencies,
-      tailwindcss: "^4.0.0",
-      "@tailwindcss/vite": "^4.0.0",
-    };
-  }
-  await fs.writeJson(filePath, packageJson, { spaces: 2 });
-}
+import fs from "fs-extra";
+
+interface UpdatePackageOptions {
+  useTailwind?: boolean;
+}
+
+export async function updatePackageJson(
+  filePath: string,
+  projectName: string,
+  options: UpdatePackageOptions = {},
+) {
+  const packageJson = await fs.readJson(filePath);
+  packageJson.name = projectName;
+  packageJson.type = "module";
+  packageJson.dependencies = {
+    ...packageJson.dependencies,
+    revine: "latest",
+  };
+
+  if (options.useTailwind) {
+    packageJson.devDependencies = {
+      ...packageJson.devDependencies,
+      tailwindcss: "^4.0.0",
+      "@tailwindcss/vite": "^4.0.0",
+    };
+  }
+  await fs.writeJson(filePath, packageJson, { spaces: 2 });
+}

package/src/config/readme.ts

@@ -1,7 +1,7 @@
-import fs from "fs-extra";
-
-export async function updateReadme(filePath: string, projectName: string) {
-  let readmeContent = await fs.readFile(filePath, "utf-8");
-  readmeContent = readmeContent.replace(/%PROJECT_NAME%/g, projectName);
-  await fs.writeFile(filePath, readmeContent);
-}
+import fs from "fs-extra";
+
+export async function updateReadme(filePath: string, projectName: string) {
+  let readmeContent = await fs.readFile(filePath, "utf-8");
+  readmeContent = readmeContent.replace(/%PROJECT_NAME%/g, projectName);
+  await fs.writeFile(filePath, readmeContent);
+}

package/src/config/vite.ts

@@ -1,19 +1,19 @@
-import fs from "fs-extra";
-
-export async function updateViteConfig(filePath: string) {
-  let viteConfigContent = await fs.readFile(filePath, "utf-8");
-
-  // Insert Tailwind import after the React plugin import.
-  viteConfigContent = viteConfigContent.replace(
-    'import react from "@vitejs/plugin-react";',
-    "import react from '@vitejs/plugin-react';\nimport tailwindcss from '@tailwindcss/vite';"
-  );
-
-  // Insert Tailwind plugin into the plugins array.
-  viteConfigContent = viteConfigContent.replace(
-    "plugins: [react(), revineLoggerPlugin()]",
-    "plugins: [\n    react(),\n    revineLoggerPlugin(),\n    tailwindcss()\n  ]"
-  );
-
-  await fs.writeFile(filePath, viteConfigContent);
-}
+import fs from "fs-extra";
+
+export async function updateViteConfig(filePath: string) {
+  let viteConfigContent = await fs.readFile(filePath, "utf-8");
+
+  // Insert Tailwind import after the React plugin import.
+  viteConfigContent = viteConfigContent.replace(
+    'import react from "@vitejs/plugin-react";',
+    "import react from '@vitejs/plugin-react';\nimport tailwindcss from '@tailwindcss/vite';"
+  );
+
+  // Insert Tailwind plugin into the plugins array.
+  viteConfigContent = viteConfigContent.replace(
+    "plugins: [react(), revineLoggerPlugin()]",
+    "plugins: [\n    react(),\n    revineLoggerPlugin(),\n    tailwindcss()\n  ]"
+  );
+
+  await fs.writeFile(filePath, viteConfigContent);
+}