@adonisjs/vite 0.0.1-9 → 1.0.0

package/build/index.d.ts

@@ -1,4 +1,3 @@
-import './src/backend/types/extended.js';
 export { configure } from './configure.js';
 export { stubsRoot } from './stubs/index.js';
 export { Vite } from './src/backend/vite.js';

package/build/index.js

@@ -6,7 +6,6 @@
  * 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';

package/build/providers/vite_provider.d.ts

@@ -1,15 +1,24 @@
-import type { Edge } from 'edge.js';
 import type { ApplicationService } from '@adonisjs/core/types';
+import type { Vite } from '../src/backend/vite.js';
+/**
+ * Extend the container bindings
+ */
+declare module '@adonisjs/core/types' {
+    interface ContainerBindings {
+        vite: Vite;
+    }
+}
 export default class ViteServiceProvider {
     protected app: ApplicationService;
     constructor(app: ApplicationService);
     /**
-     * Returns edge when it's installed
+     * Registers edge plugin when edge is installed
      */
-    protected getEdge(): Promise<Edge | null>;
-    register(): void;
+    protected registerEdgePlugin(): Promise<void>;
     /**
-     * Extending edge
+     * Registers CSP keywords when @adonisjs/shield is installed
      */
+    protected registerShieldKeywords(): Promise<void>;
+    register(): void;
     boot(): Promise<void>;
 }

package/build/providers/vite_provider.js

@@ -13,16 +13,61 @@ export default class ViteServiceProvider {
         this.app = app;
     }
     /**
-     * Returns edge when it's installed
+     * Registers edge plugin when edge is installed
      */
-    async getEdge() {
+    async registerEdgePlugin() {
+        let edge = null;
         try {
-            const { default: edge } = await import('edge.js');
-            debug('Detected edge.js package. Adding Vite primitives to it');
-            return edge;
+            const edgeExports = await import('edge.js');
+            edge = edgeExports.default;
         }
-        catch {
-            return null;
+        catch { }
+        if (edge) {
+            const vite = await this.app.container.make('vite');
+            const { edgePluginVite } = await import('../src/backend/plugins/edge.js');
+            edge.use(edgePluginVite(vite));
+        }
+    }
+    /**
+     * Registers CSP keywords when @adonisjs/shield is installed
+     */
+    async registerShieldKeywords() {
+        let cspKeywords = null;
+        try {
+            const shieldExports = await import('@adonisjs/shield');
+            cspKeywords = shieldExports.cspKeywords;
+        }
+        catch { }
+        if (cspKeywords) {
+            debug('Detected @adonisjs/shield package. Adding Vite keywords for CSP policy');
+            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://');
+            });
         }
     }
     register() {
@@ -36,15 +81,8 @@ export default class ViteServiceProvider {
             });
         });
     }
-    /**
-     * Extending edge
-     */
     async boot() {
-        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));
-        }
+        await this.registerEdgePlugin();
+        await this.registerShieldKeywords();
     }
 }

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

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

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

@@ -1,4 +1,4 @@
-import { ViteOptions } from './types/main.js';
+import { ViteOptions } from './types.js';
 /**
  * Define the backend config for resolving vite assets
  */

package/build/src/backend/{edge_plugin_vite.d.ts → plugins/edge.d.ts}

@@ -1,5 +1,5 @@
 import type { PluginFn } from 'edge.js/types';
-import type { Vite } from './vite.js';
+import type { Vite } from '../vite.js';
 /**
  * The edge plugin for vite to share vite service with edge
  * and register custom tags

package/build/src/backend/{edge_plugin_vite.js → plugins/edge.js}

@@ -7,7 +7,7 @@
  * file that was distributed with this source code.
  */
 import { EdgeError } from 'edge-error';
-import debug from './debug.js';
+import debug from '../debug.js';
 /**
  * The edge plugin for vite to share vite service with edge
  * and register custom tags
@@ -22,11 +22,29 @@ export const edgePluginVite = (vite) => {
             tagName: 'viteReactRefresh',
             seekable: true,
             block: false,
-            compile(_parser, buffer, token) {
+            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()`, token.filename, token.loc.start.line);
+                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)
                  */
@@ -58,7 +76,10 @@ export const edgePluginVite = (vite) => {
                 }
                 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}).join('\\n')`, token.filename, token.loc.start.line, false);
+                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/vite.d.ts

@@ -1,5 +1,5 @@
 import type { Manifest } from 'vite';
-import type { AdonisViteElement, ViteOptions } from './types/main.js';
+import type { AdonisViteElement, ViteOptions } from './types.js';
 /**
  * Vite class exposes the APIs to generate tags and URLs for
  * assets processed using vite.
@@ -10,7 +10,18 @@ export declare class Vite {
     /**
      * Generate tags for the entry points
      */
-    generateEntryPointsTags(entryPoints: string[] | string): AdonisViteElement[];
+    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
      */
@@ -24,5 +35,5 @@ export declare class Vite {
     /**
      * Returns the script needed for the HMR working with React
      */
-    getReactHmrScript(): AdonisViteElement | null;
+    getReactHmrScript(attributes?: Record<string, any>): AdonisViteElement | null;
 }

package/build/src/backend/vite.js

@@ -122,12 +122,13 @@ export class Vite {
     /**
      * Returns the script needed for the HMR working with Vite
      */
-    #getViteHmrScript() {
+    #getViteHmrScript(attributes) {
         return this.#generateElement({
             tag: 'script',
             attributes: {
                 type: 'module',
                 src: this.#hotAsset('@vite/client'),
+                ...attributes,
             },
             children: [],
         });
@@ -137,7 +138,7 @@ export class Vite {
      * Also adds the @vite/client script
      */
     #generateEntryPointsTagsForHotMode(entryPoints, attributes) {
-        const viteHmr = this.#getViteHmrScript();
+        const viteHmr = this.#getViteHmrScript(attributes);
         const tags = entryPoints.map((entrypoint) => this.#generateTag(entrypoint, attributes));
         return viteHmr ? [viteHmr].concat(tags) : tags;
     }
@@ -195,12 +196,33 @@ export class Vite {
     /**
      * Generate tags for the entry points
      */
-    generateEntryPointsTags(entryPoints) {
+    generateEntryPointsTags(entryPoints, attributes) {
         entryPoints = Array.isArray(entryPoints) ? entryPoints : [entryPoints];
         if (this.#isRunningHot()) {
-            return this.#generateEntryPointsTagsForHotMode(entryPoints);
+            return this.#generateEntryPointsTagsForHotMode(entryPoints, attributes);
         }
-        return this.#generateEntryPointsTagsWithManifest(entryPoints);
+        return this.#generateEntryPointsTagsWithManifest(entryPoints, attributes);
+    }
+    /**
+     * Returns the dev server URL when running in hot
+     * mode. Otherwise an empty string
+     */
+    devUrl() {
+        if (this.#isRunningHot()) {
+            return this.#readHotFile().url;
+        }
+        return '';
+    }
+    /**
+     * Returns the dev server URL when running in hot
+     * mode, otherwise returns the explicitly configured
+     * "assets" URL
+     */
+    assetsUrl() {
+        if (this.#isRunningHot()) {
+            return this.#readHotFile().url;
+        }
+        return this.#options.assetsUrl;
     }
     /**
      * Returns path to a given asset file
@@ -229,7 +251,7 @@ export class Vite {
     /**
      * Returns the script needed for the HMR working with React
      */
-    getReactHmrScript() {
+    getReactHmrScript(attributes) {
         if (!this.#isRunningHot()) {
             return null;
         }
@@ -237,6 +259,7 @@ export class Vite {
             tag: 'script',
             attributes: {
                 type: 'module',
+                ...attributes,
             },
             children: [
                 '',

package/build/src/client/main.d.ts

@@ -1,5 +1,10 @@
 import { PluginOption } from 'vite';
 import type { PluginOptions } from './types.js';
+declare module 'vite' {
+    interface ManifestChunk {
+        integrity: string;
+    }
+}
 /**
  * Vite plugin for adonisjs
  */

package/build/stubs/client_config.stub

@@ -1,6 +1,6 @@
----
-to: {{ app.makePath('vite.config.js') }}
----
+{{{
+  exports({ to: app.makePath('vite.config.js') })
+}}}
 import { defineConfig } from 'vite'
 import adonisjs from '@adonisjs/vite/client'
 
@@ -16,7 +16,7 @@ export default defineConfig({
       /**
        * Paths to watch and reload the browser on file change
        */
-      reloads: ['resources/views/**/*.edge'],
+      reload: ['resources/views/**/*.edge'],
     }),
   ],
 })

package/build/stubs/config.stub

@@ -1,6 +1,6 @@
----
-to: {{ app.configPath('vite.ts') }}
----
+{{{
+  exports({ to: app.configPath('vite.ts') })
+}}}
 import { defineConfig } from '@adonisjs/vite'
 
 const viteBackendConfig = defineConfig({

package/build/stubs/js_entrypoint.stub

@@ -1,4 +1,4 @@
----
-to: {{ app.makePath('resources/js/app.js') }}
----
+{{{
+  exports({ to: app.makePath('resources/js/app.js') })
+}}}
 console.log('Log from JS entrypoint')

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@adonisjs/vite",
   "description": "Vite plugin for Adonis.js",
-  "version": "0.0.1-9",
+  "version": "1.0.0",
   "engines": {
     "node": ">=18.16.0"
   },
@@ -22,7 +22,7 @@
     "./services/main": "./build/services/vite.js",
     "./vite_provider": "./build/providers/vite_provider.js",
     "./client": "./build/src/client/main.js",
-    "./plugin_edge": "./build/backend/edge_plugin_vite.js",
+    "./plugins/edge": "./build/backend/plugins/edge.js",
     "./types": "./build/src/backend/types.js"
   },
   "scripts": {
@@ -42,31 +42,32 @@
     "prepublishOnly": "npm run build"
   },
   "devDependencies": {
-    "@adonisjs/assembler": "^6.1.3-18",
-    "@adonisjs/core": "^6.1.5-19",
+    "@adonisjs/assembler": "^6.1.3-25",
+    "@adonisjs/core": "^6.1.5-28",
     "@adonisjs/eslint-config": "^1.1.8",
     "@adonisjs/prettier-config": "^1.1.8",
+    "@adonisjs/shield": "^8.0.0-8",
     "@adonisjs/tsconfig": "^1.1.8",
-    "@commitlint/cli": "^17.6.7",
-    "@commitlint/config-conventional": "^17.6.7",
-    "@japa/assert": "^2.0.0-1",
-    "@japa/expect-type": "^2.0.0-0",
-    "@japa/file-system": "^2.0.0-1",
-    "@japa/runner": "^3.0.0-6",
-    "@swc/core": "^1.3.78",
-    "@types/node": "^20.5.1",
+    "@commitlint/cli": "^17.8.0",
+    "@commitlint/config-conventional": "^17.8.0",
+    "@japa/assert": "^2.0.0",
+    "@japa/expect-type": "^2.0.0",
+    "@japa/file-system": "^2.0.0",
+    "@japa/runner": "^3.0.2",
+    "@swc/core": "1.3.82",
+    "@types/node": "^20.8.6",
     "c8": "^8.0.0",
     "copyfiles": "^2.4.1",
-    "del-cli": "^5.0.0",
+    "del-cli": "^5.1.0",
     "edge.js": "^6.0.0-8",
-    "eslint": "^8.45.0",
+    "eslint": "^8.51.0",
     "husky": "^8.0.3",
     "np": "^8.0.4",
-    "prettier": "^3.0.0",
-    "rollup": "^3.28.1",
+    "prettier": "^3.0.3",
+    "rollup": "^4.1.4",
     "ts-node": "^10.9.1",
-    "typescript": "^5.1.6",
-    "vite": "^4.4.9"
+    "typescript": "^5.2.2",
+    "vite": "^4.4.11"
   },
   "dependencies": {
     "defu": "^6.1.2",
@@ -74,12 +75,20 @@
     "vite-plugin-restart": "^0.3.1"
   },
   "peerDependencies": {
-    "@adonisjs/core": "^6.1.5-18",
-    "edge.js": "^6.0.0-8"
+    "@adonisjs/core": "^6.1.5-28",
+    "@adonisjs/shield": "^8.0.0-8",
+    "edge.js": "^6.0.0-8",
+    "vite": "^4.4.11"
   },
   "peerDependenciesMeta": {
+    "vite": {
+      "optional": true
+    },
     "edge.js": {
       "optional": true
+    },
+    "@adonisjs/shield": {
+      "optional": true
     }
   },
   "author": "Julien Ripouteau <julien@ripouteau.com>",
@@ -111,11 +120,11 @@
   },
   "publishConfig": {
     "access": "public",
-    "tag": "next"
+    "tag": "latest"
   },
   "np": {
     "message": "chore(release): %s",
-    "tag": "next",
+    "tag": "latest",
     "branch": "main",
     "anyBranch": false
   },

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

@@ -1,14 +0,0 @@
-import { Vite } from '../vite.js';
-/**
- * Extend the container bindings
- */
-declare module '@adonisjs/core/types' {
-    interface ContainerBindings {
-        vite: Vite;
-    }
-}
-declare module 'vite' {
-    interface ManifestChunk {
-        integrity: string;
-    }
-}

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

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