@quilted/rollup 0.1.14 → 0.1.16

package/build/typescript/module.d.ts

@@ -0,0 +1,45 @@
+import { Plugin } from 'rollup';
+import { type BrowserTargetSelection } from './shared/browserslist.ts';
+import type { MagicModuleEnvOptions } from './features/env.ts';
+export interface ModuleOptions {
+    /**
+     * The root directory containing the source code for your application.
+     */
+    root?: string | URL;
+    /**
+     * Whether to include GraphQL-related code transformations.
+     *
+     * @default true
+     */
+    graphql?: boolean;
+    /**
+     * Customizes the behavior of environment variables for your module.
+     */
+    env?: MagicModuleEnvOptions;
+    /**
+     * Customizes the assets created for your module.
+     */
+    assets?: ModuleAssetsOptions;
+}
+export interface ModuleAssetsOptions {
+    /**
+     * Whether to minify assets created for this module.
+     *
+     * @default true
+     */
+    minify?: boolean;
+    hash?: boolean;
+    targets?: BrowserTargetSelection;
+}
+export declare function quiltModule({ root: rootPath, env, assets, graphql, }?: ModuleOptions): Promise<{
+    input: string[];
+    plugins: Plugin<any>[];
+    onwarn(warning: import("rollup").RollupLog, defaultWarn: import("rollup").LoggingFunction): void;
+    output: {
+        format: "esm";
+        dir: string;
+        entryFileNames: string;
+        assetFileNames: string;
+    };
+}>;
+//# sourceMappingURL=module.d.ts.map

package/build/typescript/module.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"module.d.ts","sourceRoot":"","sources":["../../source/module.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,MAAM,EAAqB,MAAM,QAAQ,CAAC;AAMlD,OAAO,EAEL,KAAK,sBAAsB,EAC5B,MAAM,0BAA0B,CAAC;AAClC,OAAO,KAAK,EAAC,qBAAqB,EAAC,MAAM,mBAAmB,CAAC;AAE7D,MAAM,WAAW,aAAa;IAC5B;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,GAAG,GAAG,CAAC;IAEpB;;;;OAIG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAElB;;OAEG;IACH,GAAG,CAAC,EAAE,qBAAqB,CAAC;IAE5B;;OAEG;IACH,MAAM,CAAC,EAAE,mBAAmB,CAAC;CAC9B;AAED,MAAM,WAAW,mBAAmB;IAClC;;;;OAIG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,OAAO,CAAC,EAAE,sBAAsB,CAAC;CAClC;AAED,wBAAsB,WAAW,CAAC,EAChC,IAAI,EAAE,QAAwB,EAC9B,GAAG,EACH,MAAM,EACN,OAAc,GACf,GAAE,aAAkB;;;;;;;;;;GAkFpB"}

package/build/typescript/package.d.ts

@@ -4,8 +4,14 @@ export interface PackageOptions {
      * The root directory containing the source code for your application.
      */
     root?: string | URL;
+    /**
+     * Whether to include GraphQL-related code transformations.
+     *
+     * @default true
+     */
+    graphql?: boolean;
 }
-export declare function quiltPackageESModules({ root: rootPath, }?: PackageOptions): Promise<{
+export declare function quiltPackageESModules({ root: rootPath, graphql, }?: PackageOptions): Promise<{
     input: string[];
     plugins: Plugin<any>[];
     onwarn(warning: import("rollup").RollupLog, defaultWarn: import("rollup").LoggingFunction): void;
@@ -18,7 +24,7 @@ export declare function quiltPackageESModules({ root: rootPath, }?: PackageOptio
         assetFileNames: string;
     };
 }>;
-export declare function quiltPackageESNext({ root: rootPath, }?: PackageOptions): Promise<{
+export declare function quiltPackageESNext({ root: rootPath, graphql, }?: PackageOptions): Promise<{
     input: string[];
     plugins: Plugin<any>[];
     onwarn(warning: import("rollup").RollupLog, defaultWarn: import("rollup").LoggingFunction): void;

package/build/typescript/package.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"package.d.ts","sourceRoot":"","sources":["../../source/package.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,MAAM,EAAqB,MAAM,QAAQ,CAAC;AAOlD,MAAM,WAAW,cAAc;IAC7B;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,GAAG,GAAG,CAAC;CACrB;AAED,wBAAsB,qBAAqB,CAAC,EAC1C,IAAI,EAAE,QAAwB,GAC/B,GAAE,cAAmB;;;;;;;;;;;;GA2CrB;AAED,wBAAsB,kBAAkB,CAAC,EACvC,IAAI,EAAE,QAAwB,GAC/B,GAAE,cAAmB;;;;;;;;;;;;GA2CrB"}
+{"version":3,"file":"package.d.ts","sourceRoot":"","sources":["../../source/package.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,MAAM,EAAqB,MAAM,QAAQ,CAAC;AAOlD,MAAM,WAAW,cAAc;IAC7B;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,GAAG,GAAG,CAAC;IAEpB;;;;OAIG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,wBAAsB,qBAAqB,CAAC,EAC1C,IAAI,EAAE,QAAwB,EAC9B,OAAc,GACf,GAAE,cAAmB;;;;;;;;;;;;GAgDrB;AAED,wBAAsB,kBAAkB,CAAC,EACvC,IAAI,EAAE,QAAwB,EAC9B,OAAc,GACf,GAAE,cAAmB;;;;;;;;;;;;GAgDrB"}

package/build/typescript/shared/browserslist.d.ts

@@ -0,0 +1,11 @@
+export type BrowserTargetSelection = string[] | {
+    name?: string;
+    browsers?: string[];
+};
+export declare function getBrowserTargetDetails(targetSelection?: BrowserTargetSelection, { root }?: {
+    root?: string;
+}): Promise<{
+    name: string | undefined;
+    browsers: string[];
+}>;
+//# sourceMappingURL=browserslist.d.ts.map

package/build/typescript/shared/browserslist.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"browserslist.d.ts","sourceRoot":"","sources":["../../../source/shared/browserslist.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,sBAAsB,GAC9B,MAAM,EAAE,GACR;IACE,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,MAAM,EAAE,CAAC;CACrB,CAAC;AAEN,wBAAsB,uBAAuB,CAC3C,eAAe,GAAE,sBAA2B,EAC5C,EAAC,IAAI,EAAC,GAAE;IAAC,IAAI,CAAC,EAAE,MAAM,CAAA;CAAM;;;GAsB7B"}

package/package.json

@@ -6,7 +6,7 @@
     "access": "public",
     "@quilted/registry": "https://registry.npmjs.org"
   },
-  "version": "0.1.14",
+  "version": "0.1.16",
   "engines": {
     "node": ">=14.0.0"
   },
@@ -22,9 +22,23 @@
       "quilt:esnext": "./build/esnext/index.esnext",
       "import": "./build/esm/index.mjs",
       "require": "./build/cjs/index.cjs"
+    },
+    "./features/assets": {
+      "types": "./build/typescript/features/assets.d.ts",
+      "quilt:source": "./source/features/assets.ts",
+      "quilt:esnext": "./build/esnext/features/assets.esnext",
+      "import": "./build/esm/features/assets.mjs",
+      "require": "./build/cjs/features/assets.cjs"
     }
   },
   "types": "./build/typescript/index.d.ts",
+  "typesVersions": {
+    "*": {
+      "features/assets": [
+        "./build/typescript/features/assets.d.ts"
+      ]
+    }
+  },
   "sideEffects": false,
   "dependencies": {
     "@babel/core": "^7.23.0",
@@ -40,7 +54,7 @@
     "@rollup/plugin-commonjs": "^25.0.5",
     "@rollup/plugin-json": "^6.0.1",
     "@rollup/plugin-node-resolve": "^15.2.3",
-    "@quilted/assets": "^0.0.4",
+    "@quilted/assets": "^0.0.5",
     "@quilted/graphql": "^2.0.0",
     "@types/babel__preset-env": "^7.9.0",
     "browserslist": "^4.22.1",
@@ -52,7 +66,7 @@
     "mrmime": "^1.0.1",
     "rollup-plugin-esbuild": "^6.1.0",
     "rollup-plugin-node-externals": "^6.1.2",
-    "rollup-plugin-visualizer": "^5.9.0",
+    "rollup-plugin-visualizer": "^5.9.2",
     "systemjs": "^6.14.2"
   },
   "peerDependencies": {
@@ -64,8 +78,7 @@
     }
   },
   "devDependencies": {
-    "@quilted/testing": "^0.1.0",
-    "rollup": "^4.0.0"
+    "rollup": "^4.1.4"
   },
   "eslintConfig": {
     "extends": [

package/source/app.ts

@@ -17,6 +17,10 @@ import type {MagicModuleEnvOptions} from './features/env.ts';
 import {multiline} from './shared/strings.ts';
 import {getNodePlugins, removeBuildFiles} from './shared/rollup.ts';
 import {createMagicModulePlugin} from './shared/magic-module.ts';
+import {
+  getBrowserTargetDetails,
+  type BrowserTargetSelection,
+} from './shared/browserslist.ts';
 
 export interface AppOptions {
   /**
@@ -58,10 +62,10 @@ export interface AppBrowserOptions extends AppOptions {
   /**
    * The entry module for this browser. This should be an absolute path, or relative
    * path from the root directory containing your project. This entry should be the
-   * browser entrypoint.
+   * browser entrypoint. If you don’t provide a module, Quilt will automatically pick
+   *
    *
    * @example './browser.tsx'
-   * @default 'quilt:module/entry'
    */
   entry?: string;
 
@@ -102,12 +106,7 @@ export interface AppBrowserAssetsOptions {
   minify?: boolean;
 
   baseURL?: string;
-  targets?:
-    | string[]
-    | {
-        name?: string;
-        browsers?: string[];
-      };
+  targets?: BrowserTargetSelection;
   priority?: number;
 }
 
@@ -126,41 +125,21 @@ export async function quiltAppBrowser({
   const minify = assets?.minify ?? mode === 'production';
   const baseURL = assets?.baseURL ?? '/assets/';
 
-  const assetTargets = assets?.targets ?? {};
-  const targets = Array.isArray(assetTargets)
-    ? {
-        browsers: assetTargets,
-      }
-    : assetTargets;
-  const targetBrowsers =
-    targets.browsers ??
-    (await (async () => {
-      const {default: browserslist} = await import('browserslist');
-      const config = browserslist.findConfig(root);
-
-      if (config == null) return ['defaults'];
-
-      const targetName = targets.name ?? 'defaults';
-      return config[targetName] ?? ['defaults'];
-    })());
-  const normalizedTargetName =
-    targets.name === 'defaults' ? 'default' : targets.name;
-  const targetFilenamePart = normalizedTargetName
-    ? `.${normalizedTargetName}`
-    : '';
+  const browserTarget = await getBrowserTargetDetails(assets?.targets, {root});
+  const targetFilenamePart = browserTarget.name ? `.${browserTarget.name}` : '';
 
   const [
     {visualizer},
-    {assetManifest},
+    {magicModuleEnv, replaceProcessEnv},
     {sourceCode},
     {createTSConfigAliasPlugin},
     {css},
-    {rawAssets, staticAssets},
+    {assetManifest, rawAssets, staticAssets},
     {systemJS},
     nodePlugins,
   ] = await Promise.all([
     import('rollup-plugin-visualizer'),
-    import('@quilted/assets/rollup'),
+    import('./features/env.ts'),
     import('./features/source-code.ts'),
     import('./features/typescript.ts'),
     import('./features/css.ts'),
@@ -172,7 +151,9 @@ export async function quiltAppBrowser({
   const plugins: Plugin[] = [
     ...nodePlugins,
     systemJS({minify}),
-    sourceCode({mode, targets: targetBrowsers}),
+    replaceProcessEnv({mode}),
+    magicModuleEnv({...env, mode}),
+    sourceCode({mode, targets: browserTarget.browsers}),
     css({minify, emit: true}),
     rawAssets(),
     staticAssets({baseURL, emit: true}),
@@ -187,20 +168,6 @@ export async function quiltAppBrowser({
     plugins.push(tsconfigAliases);
   }
 
-  if (env) {
-    const {magicModuleEnv, replaceProcessEnv} = await import(
-      './features/env.ts'
-    );
-
-    if (typeof env === 'boolean') {
-      plugins.push(replaceProcessEnv({mode}));
-      plugins.push(magicModuleEnv({mode}));
-    } else {
-      plugins.push(replaceProcessEnv({mode}));
-      plugins.push(magicModuleEnv({mode}));
-    }
-  }
-
   const appEntry =
     app ??
     (await glob('{App,app,input}.{ts,tsx,mjs,js,jsx}', {
@@ -231,16 +198,17 @@ export async function quiltAppBrowser({
     plugins.push(minify());
   }
 
-  const cacheKey = targets.name ? {browserTarget: targets.name} : undefined;
-  const id = targets.name ? targets.name : undefined;
+  const cacheKey = browserTarget.name
+    ? {browserTarget: browserTarget.name}
+    : undefined;
+  const id = browserTarget.name ? browserTarget.name : undefined;
 
   plugins.push(
-    // @ts-expect-error The plugin still depends on Rollup 3
     assetManifest({
       id,
       cacheKey,
-      baseUrl: baseURL,
-      path: path.resolve(`build/manifests/assets${targetFilenamePart}.json`),
+      baseURL,
+      file: path.resolve(`build/manifests/assets${targetFilenamePart}.json`),
       priority: assets?.priority,
     }),
     visualizer({

package/source/features/assets.ts

@@ -1,10 +1,158 @@
 import * as path from 'path';
-import {readFile} from 'fs/promises';
+import * as fs from 'fs/promises';
 import {createHash} from 'crypto';
 
-import type {Plugin} from 'rollup';
+import type {
+  NormalizedOutputOptions,
+  OutputBundle,
+  OutputChunk,
+  Plugin,
+  PluginContext,
+} from 'rollup';
 import * as mime from 'mrmime';
 
+import type {
+  AssetsBuildManifest,
+  AssetsBuildManifestEntry,
+} from '@quilted/assets';
+
+export interface AssetManifestOptions {
+  id?: string;
+  file: string;
+  baseURL: string;
+  priority?: number;
+  cacheKey?: Record<string, any>;
+}
+
+export function assetManifest(manifestOptions: AssetManifestOptions): Plugin {
+  return {
+    name: '@quilted/asset-manifest',
+    async generateBundle(options, bundle) {
+      await writeManifestForBundle.call(this, bundle, manifestOptions, options);
+    },
+  };
+}
+
+async function writeManifestForBundle(
+  this: PluginContext,
+  bundle: OutputBundle,
+  {id, file, baseURL, cacheKey, priority}: AssetManifestOptions,
+  {format}: NormalizedOutputOptions,
+) {
+  const outputs = Object.values(bundle);
+
+  const entries = outputs.filter(
+    (output): output is OutputChunk =>
+      output.type === 'chunk' && output.isEntry,
+  );
+
+  if (entries.length === 0) {
+    throw new Error(`Could not find any entries in your rollup bundle...`);
+  }
+
+  // We assume the first entry is the "main" one. There can be
+  // more than one because each worker script is also listed as an
+  // entry (though, from a separate build).
+  const entryChunk = entries[0]!;
+
+  const dependencyMap = new Map<string, string[]>();
+
+  for (const output of outputs) {
+    if (output.type !== 'chunk') continue;
+    dependencyMap.set(output.fileName, output.imports);
+  }
+
+  const assets: string[] = [];
+  const assetIdMap = new Map<string, number>();
+
+  function getAssetId(file: string) {
+    let id = assetIdMap.get(file);
+
+    if (id == null) {
+      assets.push(`${baseURL}${file}`);
+      id = assets.length - 1;
+      assetIdMap.set(file, id);
+    }
+
+    return id;
+  }
+
+  const manifest: AssetsBuildManifest<any> = {
+    id,
+    priority,
+    cacheKey,
+    assets,
+    attributes: format === 'es' ? {scripts: {type: 'module'}} : undefined,
+    entries: {
+      default: createAssetsEntry([...entryChunk.imports, entryChunk.fileName], {
+        dependencyMap,
+        getAssetId,
+      }),
+    },
+    modules: {},
+  };
+
+  for (const output of outputs) {
+    if (output.type !== 'chunk') continue;
+
+    const originalModuleId =
+      output.facadeModuleId ?? output.moduleIds[output.moduleIds.length - 1];
+
+    if (originalModuleId == null) continue;
+
+    // This metadata is added by the rollup plugin for @quilted/async
+    const moduleId = this.getModuleInfo(originalModuleId)?.meta.quilt?.moduleId;
+
+    if (moduleId == null) continue;
+
+    manifest.modules[moduleId] = createAssetsEntry(
+      [...output.imports, output.fileName],
+      {dependencyMap, getAssetId},
+    );
+  }
+
+  await fs.mkdir(path.dirname(file), {recursive: true});
+  await fs.writeFile(file, JSON.stringify(manifest, null, 2));
+}
+
+function createAssetsEntry(
+  files: string[],
+  {
+    dependencyMap,
+    getAssetId,
+  }: {
+    dependencyMap: Map<string, string[]>;
+    getAssetId(file: string): number;
+  },
+): AssetsBuildManifestEntry {
+  const styles: number[] = [];
+  const scripts: number[] = [];
+
+  const allFiles = new Set<string>();
+  const addFile = (file: string) => {
+    if (allFiles.has(file)) return;
+    allFiles.add(file);
+
+    for (const dependency of dependencyMap.get(file) ?? []) {
+      addFile(dependency);
+    }
+  };
+
+  for (const file of files) {
+    addFile(file);
+  }
+
+  for (const file of allFiles) {
+    if (file.endsWith('.css')) {
+      styles.push(getAssetId(file));
+    } else {
+      scripts.push(getAssetId(file));
+    }
+  }
+
+  return {scripts, styles};
+}
+
 const QUERY_PATTERN = /\?.*$/s;
 const HASH_PATTERN = /#.*$/s;
 const RAW_PATTERN = /(\?|&)raw(?:&|$)/;
@@ -56,7 +204,7 @@ export function rawAssets(): Plugin {
 
       this.addWatchFile(moduleId);
 
-      const file = await readFile(moduleId, {
+      const file = await fs.readFile(moduleId, {
         encoding: 'utf-8',
       });
 
@@ -103,7 +251,7 @@ export function staticAssets({
       }
 
       const file = cleanModuleIdentifier(id);
-      const content = await readFile(file);
+      const content = await fs.readFile(file);
 
       let url: string;
 

package/source/features/source-code.ts

@@ -17,7 +17,7 @@ export function sourceCode({
   if (!useBabel) {
     return esbuild({
       // Support very modern features
-      target: 'es2023',
+      target: 'es2022',
       jsx: 'automatic',
       jsxImportSource: 'react',
       exclude: 'node_modules/**',

package/source/index.ts

@@ -5,6 +5,7 @@ export {
   type AppBrowserOptions,
   type AppServerOptions,
 } from './app.ts';
+export {quiltModule, type ModuleOptions} from './module.ts';
 export {
   quiltPackageESModules,
   quiltPackageESNext,