npm - rails-vite-plugin - Versions diffs - 0.1.0-beta.1 → 0.1.1 - Mend

rails-vite-plugin 0.1.0-beta.1 → 0.1.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (4) hide show

package/dev-server-index.html CHANGED Viewed

@@ -1,6 +1,186 @@
-<html>
-<body>
-  <h1>rails-vite-plugin</h1>
-  <p>This is the Vite dev server. Your Rails app is running on a different port.</p>
-</body>
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <title>Rails Vite</title>
+    <style>
+      *,
+      *::before,
+      *::after {
+        box-sizing: border-box;
+        margin: 0;
+        padding: 0;
+      }
+      html {
+        -webkit-font-smoothing: antialiased;
+        -moz-osx-font-smoothing: grayscale;
+      }
+      body {
+        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
+          Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";
+        min-height: 100vh;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        background-color: #f8f9fa;
+        color: #374151;
+        line-height: 1.6;
+        padding: 1.5rem;
+      }
+      @media (prefers-color-scheme: dark) {
+        body {
+          background-color: #111827;
+          color: #9ca3af;
+        }
+      }
+      .card {
+        background: #fff;
+        border-radius: 12px;
+        box-shadow:
+          0 1px 3px rgba(0, 0, 0, 0.06),
+          0 20px 40px rgba(0, 0, 0, 0.07);
+        max-width: 520px;
+        width: 100%;
+        padding: 2.5rem 2rem;
+      }
+      @media (prefers-color-scheme: dark) {
+        .card {
+          background: #1f2937;
+          box-shadow:
+            0 1px 3px rgba(0, 0, 0, 0.2),
+            0 20px 40px rgba(0, 0, 0, 0.3);
+        }
+      }
+      .logos {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        gap: 1.25rem;
+        margin-bottom: 2rem;
+      }
+      .logos svg {
+        flex-shrink: 0;
+      }
+      .plus {
+        color: #9ca3af;
+        font-size: 1.25rem;
+        font-weight: 300;
+        user-select: none;
+      }
+      .content p {
+        margin-bottom: 1rem;
+        font-size: 0.9375rem;
+      }
+      .content p:last-child {
+        margin-bottom: 0;
+      }
+      .divider {
+        border: none;
+        border-top: 1px solid #e5e7eb;
+        margin: 1.5rem 0;
+      }
+      @media (prefers-color-scheme: dark) {
+        .divider {
+          border-top-color: #374151;
+        }
+      }
+      .hint {
+        font-size: 0.8125rem;
+        color: #6b7280;
+      }
+      @media (prefers-color-scheme: dark) {
+        .hint {
+          color: #6b7280;
+        }
+      }
+      code {
+        font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas,
+          "Liberation Mono", monospace;
+        font-size: 0.8125rem;
+        background: #f3f4f6;
+        color: #1f2937;
+        padding: 0.15em 0.4em;
+        border-radius: 4px;
+      }
+      @media (prefers-color-scheme: dark) {
+        code {
+          background: #374151;
+          color: #e5e7eb;
+        }
+      }
+      a {
+        color: #cc342d;
+        text-decoration: none;
+        font-weight: 600;
+      }
+      a:hover {
+        color: #a02a24;
+        text-decoration: underline;
+      }
+      @media (prefers-color-scheme: dark) {
+        a {
+          color: #ef4444;
+        }
+        a:hover {
+          color: #f87171;
+        }
+      }
+    </style>
+  </head>
+  <body>
+    <div class="card">
+      <div class="logos">
+        <a href="https://rubyonrails.org" aria-label="Ruby on Rails">
+          <svg width="42" height="42" fill="#D30001" role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>Ruby on Rails</title><path d="M.741 19.365h8.36s-1.598-7.291 3.693-10.243l.134-.066c1.286-.637 4.907-2.431 10.702 1.854.19-.159.37-.286.37-.286s-5.503-5.492-11.63-4.878c-3.079.275-6.867 3.079-9.09 6.783C1.058 16.233.741 19.365.741 19.365Zm8.804-.783a10.682 10.682 0 0 1-.127-1.333l1.143.412c.063.498.159.963.254 1.376l-1.27-.455Zm-7.799-4.317L.529 13.82c-.201.455-.423.984-.529 1.27l1.217.444c.137-.359.36-.878.529-1.269Zm7.831.296.857.677c.042-.413.116-.825.222-1.238l-.762-.603c-.137.391-.233.783-.317 1.164Zm2.042-2.646-.508-.762c.191-.243.413-.486.656-.709l.476.72a5.958 5.958 0 0 0-.624.751ZM4.19 8.878l.752.656c-.254.265-.498.551-.72.836l-.815-.698c.244-.265.508-.529.783-.794Zm9.799 1.027-.243-.73c.265-.117.571-.233.931-.339l.233.698a6.82 6.82 0 0 0-.921.371Zm3.122-.656.042-.667c.339.021.688.064 1.048.138l-.042.656a5.859 5.859 0 0 0-1.048-.127ZM8.942 6.392l-.476-.731c-.265.138-.54.286-.826.455l.487.741c.275-.169.54-.328.815-.465Zm9.217-.053.042-.709c-.095-.053-.36-.18-1.026-.371l-.043.699c.349.116.688.243 1.027.381ZM13.238 5.28h.106l-.212-.645c-.328 0-.666.021-1.016.063l.201.625a8.87 8.87 0 0 1 .921-.043Z"/></svg>
+        </a>
+        <span class="plus">+</span>
+        <a href="https://vite.dev" aria-label="Vite">
+          <svg width="38" height="38" viewBox="0 0 410 404" fill="none" xmlns="http://www.w3.org/2000/svg">
+            <path d="M399.641 59.525 215.643 388.545c-3.816 6.826-13.638 6.994-17.69.304L7.876 59.221c-4.456-7.348 2.596-15.985 10.707-13.608l187.033 54.783c1.318.386 2.706.395 4.028.025L393.244 45.9c8.124-2.32 15.053 6.396 10.397 13.625Z" fill="url(#vite-a)"/>
+            <path d="M293.573 1.34 163.46 28.672c-2.2.462-3.834 2.347-3.967 4.577l-8.624 144.716c-.178 2.991 2.798 5.224 5.667 4.254l25.488-8.625c3.14-1.063 6.209 1.589 5.67 4.9l-7.828 48.08c-.555 3.412 2.72 6.085 5.882 4.8l19.6-7.952c3.16-1.282 6.433 1.39 5.878 4.8l-12.44 76.427c-.857 5.265 5.727 8.142 8.808 3.85l2.06-2.867L341.3 103.14c1.665-3.2-1.17-6.855-4.633-5.975l-26.357 6.698c-3.28.834-6.227-2.18-5.286-5.406L331.34 7.21c.95-3.25-2.065-6.296-5.3-5.358l-32.467 8.488Z" fill="url(#vite-b)"/>
+            <defs>
+              <linearGradient id="vite-a" x1="6.715" y1="32.086" x2="235.479" y2="344.885" gradientUnits="userSpaceOnUse">
+                <stop stop-color="#41D1FF"/>
+                <stop offset="1" stop-color="#BD34FE"/>
+              </linearGradient>
+              <linearGradient id="vite-b" x1="194.651" y1="8.818" x2="236.076" y2="292.989" gradientUnits="userSpaceOnUse">
+                <stop stop-color="#FFBD4F"/>
+                <stop offset="1" stop-color="#FF9640"/>
+              </linearGradient>
+            </defs>
+          </svg>
+        </a>
+      </div>
+      <div class="content">
+        <p>This is the <strong>Vite development server</strong> providing Hot Module Replacement for your Rails application.</p>
+        <p>Your Rails app is running on a different port. Start it with:</p>
+        <p><code>bin/dev</code></p>
+        <hr class="divider">
+        <p class="hint">
+          Need help? Read the <a href="https://github.com/skryukov/rails_vite#readme">docs &rarr;</a>
+        </p>
+      </div>
+    </div>
+  </body>
 </html>

package/dist/index.d.ts CHANGED Viewed

@@ -1,12 +1,14 @@
 import { Plugin } from 'vite';
+export type InputOption = string | string[] | Record<string, string>;
 export interface RailsViteOptions {
-    input?: string | string[];
+    input?: InputOption;
     sourceDir?: string;
-    ssr?: string;
+    ssr?: InputOption;
     ssrOutputDirectory?: string;
     devMetaFile?: string;
     buildDirectory?: string;
     publicDirectory?: string;
     refresh?: boolean | string | string[];
 }
+export declare const refreshPaths: string[];
 export default function rails(options?: RailsViteOptions): Plugin;

package/dist/index.js CHANGED Viewed

@@ -3,7 +3,7 @@ import path from 'path';
 import { fileURLToPath } from 'url';
 import picomatch from 'picomatch';
 import { loadEnv, defaultAllowedOrigins, } from 'vite';
-const defaultRefreshPaths = [
+export const refreshPaths = [
     'app/views/**/*.{erb,slim,haml}',
     'app/helpers/**/*.rb',
 ];
@@ -16,9 +16,8 @@ export default function rails(options = {}) {
     const devMetaPath = options.devMetaFile ?? path.join('tmp', 'rails-vite.json');
     const ssrOutputDirectory = options.ssrOutputDirectory ?? 'ssr';
     const resolvedInput = resolveInput(input, sourceDir);
-    const resolvedSsr = options.ssr ? resolveInput(options.ssr, sourceDir) : undefined;
+    const resolvedSsr = options.ssr !== undefined ? resolveInput(options.ssr, sourceDir) : undefined;
     let resolvedConfig;
-    let devServerUrl;
     let reactRefresh = false;
     return {
         name: 'rails-vite',
@@ -74,7 +73,7 @@ export default function rails(options = {}) {
             server.httpServer?.once('listening', () => {
                 const address = server.httpServer?.address();
                 if (isAddressInfo(address)) {
-                    devServerUrl = resolveDevServerUrl(address, resolvedConfig);
+                    const devServerUrl = resolveDevServerUrl(address, resolvedConfig);
                     resolvedConfig.server.origin = devServerUrl;
                     const meta = { url: devServerUrl, sourceDir };
                     if (reactRefresh)
@@ -96,10 +95,10 @@ export default function rails(options = {}) {
                 exitHandlersBound = true;
             }
             // Watch view templates for full-page reload
-            const refreshPaths = resolveRefreshPaths(options.refresh);
-            if (refreshPaths.length) {
-                const match = picomatch(refreshPaths);
-                server.watcher.add(refreshPaths);
+            const resolvedRefreshPaths = resolveRefreshPaths(options.refresh);
+            if (resolvedRefreshPaths.length) {
+                const match = picomatch(resolvedRefreshPaths);
+                server.watcher.add(resolvedRefreshPaths);
                 server.watcher.on('change', (filePath) => {
                     const relativePath = path.relative(process.cwd(), filePath);
                     if (match(relativePath)) {
@@ -121,6 +120,9 @@ export default function rails(options = {}) {
     };
 }
 function resolveInput(input, sourceDir) {
+    if (typeof input === 'object' && !Array.isArray(input)) {
+        return Object.fromEntries(Object.entries(input).map(([key, value]) => [key, prefixWithSourceDir(value, sourceDir)]));
+    }
     if (Array.isArray(input)) {
         return input.map((entry) => prefixWithSourceDir(entry, sourceDir));
     }
@@ -132,9 +134,13 @@ function prefixWithSourceDir(entry, sourceDir) {
     }
     return `${sourceDir}/${entry}`;
 }
-const defaultEntryExtensions = ['.js', '.ts', '.jsx', '.tsx'];
+const entrypointExtensions = /\.(mjs|js|mts|ts|jsx|tsx|css|scss|sass|less|styl|pcss)$/;
 function detectEntrypoint(sourceDir) {
-    for (const ext of defaultEntryExtensions) {
+    const entrypointsDir = path.join(sourceDir, 'entrypoints');
+    if (fs.existsSync(entrypointsDir)) {
+        return discoverEntrypoints(entrypointsDir).map((entry) => `entrypoints/${entry}`);
+    }
+    for (const ext of ['.js', '.mjs', '.ts', '.mts', '.jsx', '.tsx']) {
         const candidate = path.join(sourceDir, `application${ext}`);
         if (fs.existsSync(candidate)) {
             return `application${ext}`;
@@ -142,35 +148,42 @@ function detectEntrypoint(sourceDir) {
     }
     return 'application.js';
 }
-function resolveRefreshPaths(refresh) {
-    if (refresh === false || refresh === undefined) {
-        return defaultRefreshPaths;
-    }
-    if (refresh === true) {
-        return defaultRefreshPaths;
+function discoverEntrypoints(dir, base = dir) {
+    const entries = [];
+    for (const entry of fs.readdirSync(dir, { withFileTypes: true })) {
+        if (entry.isDirectory()) {
+            entries.push(...discoverEntrypoints(path.join(dir, entry.name), base));
+        }
+        else if (entrypointExtensions.test(entry.name)) {
+            entries.push(path.relative(base, path.join(dir, entry.name)));
+        }
     }
-    if (typeof refresh === 'string') {
+    return entries;
+}
+function resolveRefreshPaths(refresh) {
+    if (refresh === false)
+        return [];
+    if (!refresh || refresh === true)
+        return refreshPaths;
+    if (typeof refresh === 'string')
         return [refresh];
-    }
     return refresh;
 }
 function resolveDevServerUrl(address, config) {
-    const configHmrProtocol = typeof config.server.hmr === 'object' ? config.server.hmr.protocol : null;
-    const clientProtocol = configHmrProtocol
-        ? configHmrProtocol === 'wss'
+    const hmr = typeof config.server.hmr === 'object' ? config.server.hmr : null;
+    const clientProtocol = hmr?.protocol
+        ? hmr.protocol === 'wss'
             ? 'https'
             : 'http'
         : null;
     const serverProtocol = config.server.https ? 'https' : 'http';
     const protocol = clientProtocol ?? serverProtocol;
-    const configHmrHost = typeof config.server.hmr === 'object' ? config.server.hmr.host : null;
     const configHost = typeof config.server.host === 'string' ? config.server.host : null;
     const serverAddress = address.family === 'IPv6' || address.family === 6
         ? `[${address.address}]`
         : address.address;
-    const host = configHmrHost ?? configHost ?? serverAddress;
-    const configHmrClientPort = typeof config.server.hmr === 'object' ? config.server.hmr.clientPort : null;
-    const port = configHmrClientPort ?? address.port;
+    const host = hmr?.host ?? configHost ?? serverAddress;
+    const port = hmr?.clientPort ?? address.port;
     return `${protocol}://${host}:${port}`;
 }
 function isAddressInfo(x) {

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "rails-vite-plugin",
-  "version": "0.1.0-beta.1",
+  "version": "0.1.1",
   "description": "Vite plugin for Rails integration",
   "author": "Svyatoslav Kryukov <me@skryukov.dev>",
   "license": "MIT",