@adonisjs/vite 0.0.1-0 → 0.0.1-10

package/build/configure.d.ts

@@ -1,3 +1,5 @@
 import type Configure from '@adonisjs/core/commands/configure';
+/**
+ * Configures the package
+ */
 export declare function configure(command: Configure): Promise<void>;
-//# sourceMappingURL=configure.d.ts.map

package/build/configure.js

@@ -1,13 +1,27 @@
-import { join } from 'node:path';
-import { fileURLToPath } from 'node:url';
+/*
+ * @adonisjs/vite
+ *
+ * (c) AdonisJS
+ *
+ * For the full copyright and license information, please view the LICENSE
+ * file that was distributed with this source code.
+ */
+/**
+ * Configures the package
+ */
 export async function configure(command) {
-    const stubDestination = join(fileURLToPath(command.app.appRoot), 'vite.config.js');
-    await command.publishStub('vite/vite_config.stub', {
-        destination: stubDestination,
+    await command.publishStub('config.stub');
+    await command.publishStub('client_config.stub');
+    await command.publishStub('js_entrypoint.stub');
+    const codemods = await command.createCodemods();
+    await codemods.updateRcFile((rcFile) => {
+        rcFile.addProvider('@adonisjs/vite/vite_provider');
+        rcFile.addMetaFile('public/**', false);
     });
-    await command.updateRcFile((rcFile) => {
-        rcFile.addProvider('@adonisjs/vite/providers/vite_provider');
-    });
-    const packagesToInstall = [{ name: 'vite', isDevDependency: true }];
-    command.listPackagesToInstall(packagesToInstall);
+    if (await command.prompt.confirm('Do you want to install "vite"?')) {
+        await command.installPackages([{ name: 'vite', isDevDependency: true }]);
+    }
+    else {
+        command.listPackagesToInstall([{ name: 'vite', isDevDependency: true }]);
+    }
 }

package/build/index.d.ts

@@ -2,4 +2,4 @@ import './src/backend/types/extended.js';
 export { configure } from './configure.js';
 export { stubsRoot } from './stubs/index.js';
 export { Vite } from './src/backend/vite.js';
-//# sourceMappingURL=index.d.ts.map
+export { defineConfig } from './src/backend/define_config.js';

package/build/index.js

@@ -1,4 +1,13 @@
+/*
+ * @adonisjs/vite
+ *
+ * (c) AdonisJS
+ *
+ * For the full copyright and license information, please view the LICENSE
+ * file that was distributed with this source code.
+ */
 import './src/backend/types/extended.js';
 export { configure } from './configure.js';
 export { stubsRoot } from './stubs/index.js';
 export { Vite } from './src/backend/vite.js';
+export { defineConfig } from './src/backend/define_config.js';

package/build/providers/vite_provider.d.ts

@@ -1,10 +1,20 @@
-import '@adonisjs/view';
-import { ApplicationService } from '@adonisjs/core/types';
+import type { Edge } from 'edge.js';
+import type { ApplicationService } from '@adonisjs/core/types';
+import type { cspKeywords } from '@adonisjs/shield';
 export default class ViteServiceProvider {
-    #private;
     protected app: ApplicationService;
     constructor(app: ApplicationService);
+    /**
+     * Returns edge when it's installed
+     */
+    protected getEdge(): Promise<Edge | null>;
+    /**
+     * Returns shield CSP keywords, when the package is installed
+     */
+    protected getShieldCspKeywords(): Promise<typeof cspKeywords | null>;
     register(): void;
+    /**
+     * Extending edge
+     */
     boot(): Promise<void>;
 }
-//# sourceMappingURL=vite_provider.d.ts.map

package/build/providers/vite_provider.js

@@ -1,48 +1,94 @@
-import '@adonisjs/view';
-import { Vite } from '../src/backend/vite.js';
-import { EdgeError } from 'edge-error';
+/*
+ * @adonisjs/vite
+ *
+ * (c) AdonisJS
+ *
+ * For the full copyright and license information, please view the LICENSE
+ * file that was distributed with this source code.
+ */
+import debug from '../src/backend/debug.js';
 export default class ViteServiceProvider {
     app;
     constructor(app) {
         this.app = app;
     }
-    #registerViteTag(view) {
-        view.registerTag({
-            tagName: 'vite',
-            seekable: true,
-            block: false,
-            compile(parser, buffer, token) {
-                if (!token.properties.jsArg.trim()) {
-                    throw new EdgeError('Missing entrypoint name', 'E_RUNTIME_EXCEPTION', {
-                        filename: token.filename,
-                        line: token.loc.start.line,
-                        col: token.loc.start.col,
-                    });
-                }
-                const parsed = parser.utils.transformAst(parser.utils.generateAST(token.properties.jsArg, token.loc, token.filename), token.filename, parser);
-                const entrypoints = parser.utils.stringify(parsed);
-                buffer.outputExpression(`state.vite.generateEntryPointsTags(${entrypoints})`, token.filename, token.loc.start.line, false);
-            },
-        });
+    /**
+     * Returns edge when it's installed
+     */
+    async getEdge() {
+        try {
+            const { default: edge } = await import('edge.js');
+            debug('Detected edge.js package. Adding Vite primitives to it');
+            return edge;
+        }
+        catch {
+            return null;
+        }
     }
-    #registerViteReactTag(view) {
-        view.registerTag({
-            tagName: 'viteReactRefresh',
-            seekable: true,
-            block: false,
-            compile(_parser, buffer, token) {
-                buffer.outputExpression(`state.vite.getReactHmrScript()`, token.filename, token.loc.start.line, false);
-            },
-        });
+    /**
+     * Returns shield CSP keywords, when the package is installed
+     */
+    async getShieldCspKeywords() {
+        try {
+            const { cspKeywords } = await import('@adonisjs/shield');
+            debug('Detected @adonisjs/shield package. Adding Vite keywords for CSP policy');
+            return cspKeywords;
+        }
+        catch {
+            return null;
+        }
     }
     register() {
-        this.app.container.singleton('vite', async () => new Vite(this.app));
+        this.app.container.singleton('vite', async () => {
+            const { Vite } = await import('../src/backend/vite.js');
+            const config = this.app.config.get('vite');
+            return new Vite({
+                ...config,
+                buildDirectory: this.app.makePath(config.buildDirectory || 'public/build'),
+                hotFile: this.app.makePath(config.hotFile || 'public/build/hot.json'),
+            });
+        });
     }
+    /**
+     * Extending edge
+     */
     async boot() {
-        const view = await this.app.container.make('view');
-        const vite = await this.app.container.make('vite');
-        view.global('vite', vite);
-        this.#registerViteTag(view);
-        this.#registerViteReactTag(view);
+        const edge = await this.getEdge();
+        if (edge) {
+            const vite = await this.app.container.make('vite');
+            const { edgePluginVite } = await import('../src/backend/edge_plugin_vite.js');
+            edge.use(edgePluginVite(vite));
+        }
+        const cspKeywords = await this.getShieldCspKeywords();
+        if (cspKeywords) {
+            const vite = await this.app.container.make('vite');
+            /**
+             * Registering the @viteUrl keyword for CSP directives.
+             * Returns http URL to the dev or the CDN server, otherwise
+             * an empty string
+             */
+            cspKeywords.register('@viteUrl', function () {
+                const assetsURL = vite.assetsUrl();
+                if (!assetsURL || !assetsURL.startsWith('http://') || assetsURL.startsWith('https://')) {
+                    return '';
+                }
+                return assetsURL;
+            });
+            /**
+             * Registering the @viteDevUrl keyword for the CSP directives.
+             * Returns the dev server URL in development and empty string
+             * in prod
+             */
+            cspKeywords.register('@viteDevUrl', function () {
+                return vite.devUrl();
+            });
+            /**
+             * Registering the @viteHmrUrl keyword for the CSP directives.
+             * Returns the Websocket URL for the HMR server
+             */
+            cspKeywords.register('@viteHmrUrl', function () {
+                return vite.devUrl().replace('http://', 'ws://').replace('https://', 'wss://');
+            });
+        }
     }
 }

package/build/services/vite.d.ts

@@ -1,4 +1,3 @@
-import { Vite } from '../index.js';
+import type { Vite } from '../src/backend/vite.js';
 declare let vite: Vite;
 export { vite as default };
-//# sourceMappingURL=vite.d.ts.map

package/build/services/vite.js

@@ -1,5 +1,17 @@
+/*
+ * @adonisjs/vite
+ *
+ * (c) AdonisJS
+ *
+ * For the full copyright and license information, please view the LICENSE
+ * file that was distributed with this source code.
+ */
 import app from '@adonisjs/core/services/app';
 let vite;
+/**
+ * Returns a singleton instance of Vite class
+ * from the container
+ */
 await app.booted(async () => {
     vite = await app.container.make('vite');
 });

package/build/src/backend/debug.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="@types/node" resolution-mode="require"/>
+declare const _default: import("util").DebugLogger;
+export default _default;

package/{src/backend/types/extended.ts → build/src/backend/debug.js}

@@ -6,14 +6,5 @@
  * For the full copyright and license information, please view the LICENSE
  * file that was distributed with this source code.
  */
-
-import { Vite } from '../vite.js'
-
-/**
- * Extend the container bindings
- */
-declare module '@adonisjs/core/types' {
-  interface ContainerBindings {
-    vite: Vite
-  }
-}
+import { debuglog } from 'node:util';
+export default debuglog('adonisjs:vite');

package/build/src/backend/define_config.d.ts

@@ -0,0 +1,5 @@
+import { ViteOptions } from './types/main.js';
+/**
+ * Define the backend config for resolving vite assets
+ */
+export declare function defineConfig(config: Partial<ViteOptions>): ViteOptions;

package/build/src/backend/define_config.js

@@ -0,0 +1,19 @@
+/*
+ * @adonisjs/vite
+ *
+ * (c) AdonisJS
+ *
+ * For the full copyright and license information, please view the LICENSE
+ * file that was distributed with this source code.
+ */
+/**
+ * Define the backend config for resolving vite assets
+ */
+export function defineConfig(config) {
+    return {
+        buildDirectory: 'public/assets',
+        hotFile: 'public/assets/hot.json',
+        assetsUrl: '/assets',
+        ...config,
+    };
+}

package/build/src/backend/edge_plugin_vite.d.ts

@@ -0,0 +1,7 @@
+import type { PluginFn } from 'edge.js/types';
+import type { Vite } from './vite.js';
+/**
+ * The edge plugin for vite to share vite service with edge
+ * and register custom tags
+ */
+export declare const edgePluginVite: (vite: Vite) => PluginFn<undefined>;

package/build/src/backend/edge_plugin_vite.js

@@ -0,0 +1,86 @@
+/*
+ * @adonisjs/vite
+ *
+ * (c) AdonisJS
+ *
+ * For the full copyright and license information, please view the LICENSE
+ * file that was distributed with this source code.
+ */
+import { EdgeError } from 'edge-error';
+import debug from './debug.js';
+/**
+ * The edge plugin for vite to share vite service with edge
+ * and register custom tags
+ */
+export const edgePluginVite = (vite) => {
+    return (edge) => {
+        debug('sharing vite and asset globals with edge');
+        edge.global('vite', vite);
+        edge.global('asset', vite.assetPath.bind(vite));
+        debug('registering vite tags with edge');
+        edge.registerTag({
+            tagName: 'viteReactRefresh',
+            seekable: true,
+            block: false,
+            compile(parser, buffer, token) {
+                let attributes = '';
+                if (token.properties.jsArg.trim()) {
+                    /**
+                     * Converting a single argument to a SequenceExpression so that we
+                     * work around the following edge cases.
+                     *
+                     * - If someone passes an object literal to the tag, ie { nonce: 'foo' }
+                     *   it will be parsed as a LabeledStatement and not an object.
+                     * - If we wrap the object literal inside parenthesis, ie ({nonce: 'foo'})
+                     *   then we will end up messing other expressions like a variable reference
+                     *   , or a member expression and so on.
+                     * - So the best bet is to convert user supplied argument to a sequence expression
+                     *   and hence ignore it during stringification.
+                     */
+                    const jsArg = `a,${token.properties.jsArg}`;
+                    const parsed = parser.utils.transformAst(parser.utils.generateAST(jsArg, token.loc, token.filename), token.filename, parser);
+                    attributes = parser.utils.stringify(parsed.expressions[1]);
+                }
+                /**
+                 * Get HMR script
+                 */
+                buffer.writeExpression(`const __vite_hmr_script = state.vite.getReactHmrScript(${attributes})`, token.filename, token.loc.start.line);
+                /**
+                 * Check if the script exists (only in hot mode)
+                 */
+                buffer.writeStatement('if(__vite_hmr_script) {', token.filename, token.loc.start.line);
+                /**
+                 * Write output
+                 */
+                buffer.outputExpression(`__vite_hmr_script.toString()`, token.filename, token.loc.start.line, false);
+                /**
+                 * Close if block
+                 */
+                buffer.writeStatement('}', token.filename, token.loc.start.line);
+            },
+        });
+        edge.registerTag({
+            tagName: 'vite',
+            seekable: true,
+            block: false,
+            compile(parser, buffer, token) {
+                /**
+                 * Ensure an argument is defined
+                 */
+                if (!token.properties.jsArg.trim()) {
+                    throw new EdgeError('Missing entrypoint name', 'E_RUNTIME_EXCEPTION', {
+                        filename: token.filename,
+                        line: token.loc.start.line,
+                        col: token.loc.start.col,
+                    });
+                }
+                const parsed = parser.utils.transformAst(parser.utils.generateAST(token.properties.jsArg, token.loc, token.filename), token.filename, parser);
+                const entrypoints = parser.utils.stringify(parsed);
+                const methodCall = parsed.type === 'SequenceExpression'
+                    ? `generateEntryPointsTags${entrypoints}`
+                    : `generateEntryPointsTags(${entrypoints})`;
+                buffer.outputExpression(`state.vite.${methodCall}.join('\\n')`, token.filename, token.loc.start.line, false);
+            },
+        });
+    };
+};

package/build/src/backend/types/extended.d.ts

@@ -1,7 +1,14 @@
 import { Vite } from '../vite.js';
+/**
+ * Extend the container bindings
+ */
 declare module '@adonisjs/core/types' {
     interface ContainerBindings {
         vite: Vite;
     }
 }
-//# sourceMappingURL=extended.d.ts.map
+declare module 'vite' {
+    interface ManifestChunk {
+        integrity: string;
+    }
+}

package/build/src/backend/types/extended.js

@@ -1 +1,9 @@
+/*
+ * @adonisjs/vite
+ *
+ * (c) AdonisJS
+ *
+ * For the full copyright and license information, please view the LICENSE
+ * file that was distributed with this source code.
+ */
 export {};

package/build/src/backend/types/main.d.ts

@@ -1,9 +1,65 @@
+/**
+ * Contents of the hotfile
+ */
 export type HotFile = {
     url: string;
 };
+/**
+ * Parameters passed to the setAttributes callback
+ */
 export type SetAttributesCallbackParams = {
     src: string;
     url: string;
 };
+/**
+ * Attributes to be set on the script/style tags.
+ * Can be either a record or a callback that returns a record.
+ */
 export type SetAttributes = Record<string, string | boolean> | ((params: SetAttributesCallbackParams) => Record<string, string | boolean>);
-//# sourceMappingURL=main.d.ts.map
+/**
+ * Representation of an AdonisJS Vite Element returned
+ * by different tags generation APIs
+ */
+export type AdonisViteElement = {
+    tag: 'link';
+    attributes: Record<string, any>;
+} | {
+    tag: 'script';
+    attributes: Record<string, any>;
+    children: string[];
+};
+/**
+ * Vite backend integration configuration options
+ */
+export type ViteOptions = {
+    /**
+     * Path to the hot file relative from the root of the
+     * application.
+     *
+     * @default public/assets/hot.json
+     */
+    hotFile: string;
+    /**
+     * Public directory where the assets will be compiled.
+     *
+     * @default 'public/assets'
+     */
+    buildDirectory: string;
+    /**
+     * The URL to prefix when generating assets URLs. For example: This
+     * could the CDN URL when generating the production build
+     *
+     * @default ''
+     */
+    assetsUrl?: string;
+    /**
+     * A custom set of attributes to apply on all
+     * script tags
+     */
+    scriptAttributes?: SetAttributes;
+    /**
+     * A custom set of attributes to apply on all
+     * style tags
+     */
+    styleAttributes?: SetAttributes;
+};

package/build/src/backend/types/main.js

@@ -1 +1,9 @@
+/*
+ * @adonisjs/vite
+ *
+ * (c) AdonisJS
+ *
+ * For the full copyright and license information, please view the LICENSE
+ * file that was distributed with this source code.
+ */
 export {};

package/build/src/backend/utils.d.ts

@@ -1,2 +1,8 @@
+/**
+ * Returns a new array with unique items by the given key
+ */
 export declare function uniqBy<T>(array: T[], key: keyof T): T[];
-//# sourceMappingURL=utils.d.ts.map
+/**
+ * Convert Record of attributes to a valid HTML string
+ */
+export declare function makeAttributes(attributes: Record<string, string | boolean>): string;

package/build/src/backend/utils.js

@@ -1,3 +1,14 @@
+/*
+ * @adonisjs/vite
+ *
+ * (c) AdonisJS
+ *
+ * For the full copyright and license information, please view the LICENSE
+ * file that was distributed with this source code.
+ */
+/**
+ * Returns a new array with unique items by the given key
+ */
 export function uniqBy(array, key) {
     const seen = new Set();
     return array.filter((item) => {
@@ -5,3 +16,21 @@ export function uniqBy(array, key) {
         return seen.has(k) ? false : seen.add(k);
     });
 }
+/**
+ * Convert Record of attributes to a valid HTML string
+ */
+export function makeAttributes(attributes) {
+    return Object.keys(attributes)
+        .map((key) => {
+        const value = attributes[key];
+        if (value === true) {
+            return key;
+        }
+        if (!value) {
+            return null;
+        }
+        return `${key}="${value}"`;
+    })
+        .filter((attr) => attr !== null)
+        .join(' ');
+}

package/build/src/backend/vite.d.ts

@@ -1,19 +1,39 @@
 import type { Manifest } from 'vite';
-import { SetAttributes } from './types/main.js';
-import { ApplicationService } from '@adonisjs/core/types';
+import type { AdonisViteElement, ViteOptions } from './types/main.js';
+/**
+ * Vite class exposes the APIs to generate tags and URLs for
+ * assets processed using vite.
+ */
 export declare class Vite {
     #private;
-    private application;
-    constructor(application: ApplicationService);
-    generateEntryPointsTags(entryPoints: string[] | string): string;
+    constructor(options: ViteOptions);
+    /**
+     * Generate tags for the entry points
+     */
+    generateEntryPointsTags(entryPoints: string[] | string, attributes?: Record<string, any>): AdonisViteElement[];
+    /**
+     * Returns the dev server URL when running in hot
+     * mode. Otherwise an empty string
+     */
+    devUrl(): string;
+    /**
+     * Returns the dev server URL when running in hot
+     * mode, otherwise returns the explicitly configured
+     * "assets" URL
+     */
+    assetsUrl(): string | undefined;
+    /**
+     * Returns path to a given asset file
+     */
     assetPath(asset: string): string;
+    /**
+     * Returns the manifest file contents
+     *
+     * @throws Will throw an exception when running in hot mode
+     */
     manifest(): Manifest;
-    getReactHmrScript(): string;
-    setHotFilePath(path: string): this;
-    setManifestFilename(name: string): this;
-    setBuildDirectory(path: string): this;
-    setAssetsUrl(url: string): this;
-    setScriptAttributes(attributes: SetAttributes): this;
-    setStyleAttributes(attributes: SetAttributes): this;
+    /**
+     * Returns the script needed for the HMR working with React
+     */
+    getReactHmrScript(attributes?: Record<string, any>): AdonisViteElement | null;
 }
-//# sourceMappingURL=vite.d.ts.map