zuby 1.0.41 → 1.0.43

package/commands/build.js

@@ -1,36 +1,35 @@
-import { MODES } from '../types.js';
-import { getZubyInternalConfig } from '../config.js';
+import { MODES, PLUGIN_HOOKS } from '../types.js';
+import { executePlugins, getZubyInternalConfig } from '../config.js';
 import chalk from 'chalk';
 import { getTitle } from '../branding.js';
 import { build as viteBuild } from 'vite';
-import { dirname, join } from 'path';
+import { dirname, join, resolve } from 'path';
 import { normalizePath } from '../utils/pathUtils.js';
-import { existsSync, rmSync, writeFileSync, copyFileSync, mkdirSync } from 'fs';
+import { existsSync, rmSync, writeFileSync, copyFileSync, readFileSync, } from 'fs';
 import { TEMPLATES } from '../templates/types.js';
 import { glob } from 'glob';
 import { fileURLToPath } from 'url';
 import { getZubyPackageConfig } from '../packageConfig.js';
-import { nodeFileTrace } from '@vercel/nft';
-import { copyFile } from 'fs/promises';
+import { getTemplates } from '../templates/index.js';
+import { CLIENT_CHUNKS_MANIFEST, SERVER_CHUNKS_MANIFEST } from '../constants.js';
 const __filename = fileURLToPath(import.meta.url);
 const __dirname = dirname(__filename);
 export default async function build(options) {
     const zubyInternalConfig = await getZubyInternalConfig(options.configFile);
-    const { vite: viteConfig, customLogger: logger, outDir, srcDir, cacheDir, publicDir, configFilePath, } = zubyInternalConfig;
+    const { vite: viteConfig, customLogger: logger, outDir, cacheDir, plugins } = zubyInternalConfig;
+    let buildStep = 1;
+    const buildSteps = 2 + plugins.filter(plugin => plugin?.buildStep).length;
+    const nextBuildStep = (description) => {
+        logger?.info(`${chalk.bgYellow.bold.whiteBright(` Step ${buildStep++}/${buildSteps} `)} ${chalk.gray(description)}`);
+    };
     process.env.NODE_ENV = MODES.production;
     logger?.info(getTitle(chalk.gray(`building for production...`)));
-    // Clean build directory
-    if (existsSync(outDir || '')) {
-        rmSync(outDir || '', {
-            recursive: true,
-        });
-    }
+    // Load templates from the project directory
+    const templates = await getTemplates();
     // Load the entry file from the project directory
     // or jsxProvider
     const entryFile = await getEntryFile(zubyInternalConfig);
-    // Client build
-    logger?.info(`${chalk.bgYellow.bold.whiteBright(` Step 1/4 `)} ${chalk.gray(`building client...`)}`);
-    await viteBuild({
+    const clientViteBuildConfig = {
         configFile: false,
         ...viteConfig,
         build: {
@@ -45,10 +44,8 @@ export default async function build(options) {
         },
         cacheDir: normalizePath(join(cacheDir, 'client')),
         mode: MODES.production,
-    });
-    // Server build
-    logger?.info(`${chalk.bgYellow.bold.whiteBright(` Step 2/4 `)} ${chalk.gray(`building server...`)}`);
-    await viteBuild({
+    };
+    const serverViteBuildConfig = {
         ...viteConfig,
         configFile: false,
         publicDir: false,
@@ -60,6 +57,36 @@ export default async function build(options) {
         },
         cacheDir: normalizePath(join(cacheDir, 'server')),
         mode: MODES.production,
+    };
+    // Run build setup hook
+    await executePlugins(zubyInternalConfig, PLUGIN_HOOKS.ZubyBuildSetup, {
+        clientViteBuildConfig,
+        serverViteBuildConfig,
+        templates,
+    });
+    // Run build start hook
+    await executePlugins(zubyInternalConfig, PLUGIN_HOOKS.ZubyBuildStart, {
+        templates,
+    });
+    // Clean build directory
+    if (existsSync(outDir || '')) {
+        rmSync(outDir || '', {
+            recursive: true,
+        });
+    }
+    // Client build
+    nextBuildStep('building client...');
+    await viteBuild(clientViteBuildConfig);
+    // Run build client done hook
+    await executePlugins(zubyInternalConfig, PLUGIN_HOOKS.ZubyBuildClientDone, {
+        templates,
+    });
+    // Server build
+    nextBuildStep('building server...');
+    await viteBuild(serverViteBuildConfig);
+    // Run build server done hook
+    await executePlugins(zubyInternalConfig, PLUGIN_HOOKS.ZubyBuildServerDone, {
+        templates,
     });
     // Add serialized zuby config to build directory
     writeFileSync(normalizePath(join(outDir, 'zuby.config.json')), JSON.stringify(zubyInternalConfig, null, 2));
@@ -72,30 +99,29 @@ export default async function build(options) {
         name,
         version,
     }));
-    logger?.info(`${chalk.bgYellow.bold.whiteBright(` Step 4/4 `)} ${chalk.gray(`tracing dependencies...`)}`);
-    logger?.info(`Tracing production dependencies...`);
-    const serverFiles = await glob(`${normalizePath(outDir)}/server/**/*.js`);
-    const { fileList } = await nodeFileTrace(serverFiles, {
-        processCwd: process.cwd(),
-        ignore: (path) => {
-            return path.startsWith(outDir);
-        },
-    });
-    logger?.info(`Copying ${fileList.size} files...`);
-    const copyFilePromises = [...fileList].map(async (srcFile) => {
-        const destFile = normalizePath(join(outDir, srcFile));
-        const destDir = dirname(destFile);
-        if (srcFile.startsWith(outDir) || existsSync(destFile)) {
+    // Load the chunks manifest files
+    const clientChunksManifestPath = resolve(outDir, CLIENT_CHUNKS_MANIFEST);
+    const serverChunksManifestPath = resolve(outDir, SERVER_CHUNKS_MANIFEST);
+    const clientChunksManifest = existsSync(clientChunksManifestPath)
+        ? JSON.parse(readFileSync(clientChunksManifestPath, 'utf-8'))
+        : {};
+    const serverChunksManifest = existsSync(serverChunksManifestPath)
+        ? JSON.parse(readFileSync(serverChunksManifestPath, 'utf-8'))
+        : {};
+    // Run build done hook
+    // to execute plugins that are part of the build process
+    await executePlugins(zubyInternalConfig, PLUGIN_HOOKS.ZubyBuildDone, {
+        templates,
+        clientChunksManifest,
+        serverChunksManifest,
+    }, zubyPlugin => {
+        // Hide plugins that are not part of the build process
+        // from the CLI output to avoid confusion
+        if (!zubyPlugin.buildStep)
             return;
-        }
-        if (!existsSync(destDir)) {
-            mkdirSync(destDir, {
-                recursive: true,
-            });
-        }
-        return copyFile(srcFile, destFile);
+        // Increment build step with plugin description
+        nextBuildStep(zubyPlugin.description || zubyPlugin.name);
     });
-    await Promise.all(copyFilePromises);
     logger?.info(`Done! 🎉`);
 }
 export async function getEntryFile(zubyInternalConfig) {

package/commands/dev.js

@@ -1,15 +1,24 @@
-import { getZubyInternalConfig } from '../config.js';
+import { PLUGIN_HOOKS } from '../types.js';
+import { executePlugins, getZubyInternalConfig } from '../config.js';
 import { performance } from 'node:perf_hooks';
 import { getTitle } from '../branding.js';
 import chalk from 'chalk';
 import ZubyDevServer from '../server/zubyDevServer.js';
 export default async function dev(options) {
-    const zubyConfig = await getZubyInternalConfig(options.configFile);
-    const { customLogger: logger } = zubyConfig;
+    const zubyInternalConfig = await getZubyInternalConfig(options.configFile);
+    const { customLogger: logger, server } = zubyInternalConfig;
     const startTime = performance.now();
-    const { host = '127.0.0.1', port = 3000 } = zubyConfig.server;
-    const zubyDevServer = new ZubyDevServer(zubyConfig);
+    const { host = '127.0.0.1', port = 3000 } = server;
+    const zubyDevServer = new ZubyDevServer(zubyInternalConfig);
+    // Run dev setup hook
+    await executePlugins(zubyInternalConfig, PLUGIN_HOOKS.ZubyDevSetup, {
+        devServer: zubyDevServer,
+    });
     await zubyDevServer.listen();
+    // Run dev start hook
+    await executePlugins(zubyInternalConfig, PLUGIN_HOOKS.ZubyDevStart, {
+        devServer: zubyDevServer,
+    });
     const readyTime = performance.now();
     logger?.info(`  ${getTitle(chalk.gray(`started in ${Math.round(readyTime - startTime)}ms`))}\r\n`);
     logger?.info(`  ┃ Mode     development`);

package/config.d.ts

@@ -1,4 +1,5 @@
-import { ZubyConfig, ZubyInternalConfig } from './types.js';
+import { PluginHook, ZubyConfig, ZubyHookParams, ZubyInternalConfig, ZubyPlugin } from './types.js';
+import type { PluginOption as VitePluginOption, Plugin as VitePlugin } from 'vite';
 /**
  * Returns the path to the ZubyConfig file.
  */
@@ -26,8 +27,24 @@ export declare const validateConfig: (config: ZubyConfig) => void;
  */
 export declare const mergeDefaultConfig: (config: ZubyConfig) => Promise<ZubyInternalConfig>;
 /**
- * This function returns the array of built-in Zuby plugins.
+ * This function returns the array of built-in plugins.
  * Check which framework components are relying on each plugin
  * before removing any of them.
  */
-export declare const getBuiltInPlugins: () => (false | import("vite").Plugin<any> | import("vite").PluginOption[] | Promise<false | import("vite").Plugin<any> | import("vite").PluginOption[] | null | undefined> | null | undefined)[];
+export declare const getBuiltInPlugins: () => VitePlugin<any>[];
+/**
+ * Executes the Zuby plugins for the given hook.
+ * @param config The ZubyConfig or ZubyInternalConfig object.
+ * @param hookName The name of the hook to execute.
+ * @param params Additional params to pass to the plugins.
+ * @param beforeHook Callback function to execute before each plugin hook.
+ * @param afterHook Callback function to execute after each plugin hook.
+ * @example executePlugins(config, 'zuby:config:setup', { config, logger })
+ */
+export declare const executePlugins: (config: ZubyConfig | ZubyInternalConfig, hookName: PluginHook, params?: ExecutePluginsParams, beforeHook?: (plugin: ZubyPlugin) => void | Promise<void>, afterHook?: (plugin: ZubyPlugin, hookResult: any) => void | Promise<void>) => Promise<void>;
+export type ExecutePluginsParams = Omit<ZubyHookParams, 'command' | 'logger' | 'config'>;
+/**
+ * Normalizes the plugins to common array format.
+ * @param plugins
+ */
+export declare const normalizePlugins: (plugins: (ZubyPlugin | ZubyPlugin[] | VitePluginOption | VitePluginOption[])[]) => Promise<(ZubyPlugin | VitePlugin)[]>;

package/config.js

@@ -1,3 +1,4 @@
+import { PLUGIN_HOOKS, } from './types.js';
 import { BUILD_CHUNKS_MANIFEST, ZUBY_CONFIG_FILE } from './constants.js';
 import { existsSync } from 'fs';
 import { bundleRequire } from 'bundle-require';
@@ -6,8 +7,9 @@ import { createLogger } from './logger/index.js';
 import contextPlugin from './plugins/contextPlugin/index.js';
 import compileTimePlugin from './plugins/compileTimePlugin/index.js';
 import chunkNamingPlugin from './plugins/chunkNamingPlugin/index.js';
-import prerenderPlugin from './plugins/prerenderPlugin/index.js';
 import manifestPlugin from './plugins/manifestPlugin/index.js';
+import prerenderPlugin from './plugins/prerenderPlugin/index.js';
+import standaloneBuildPlugin from './plugins/dependenciesPlugin/index.js';
 let zubyInternalConfig;
 /**
  * Returns the path to the ZubyConfig file.
@@ -33,8 +35,9 @@ export const getZubyConfig = async (configFilePath) => {
     const { mod } = await bundleRequire({
         filepath: configFilePath,
     });
-    // Find the default export and cache the config
-    const zubyConfig = mod.default || mod;
+    // Find the default export
+    // and wait for it to resolve if it's a promise
+    const zubyConfig = await Promise.resolve(mod.default || mod);
     if (!zubyConfig) {
         throw new Error(`No valid default export found in ZubyConfig file: ${configFilePath}`);
     }
@@ -52,8 +55,12 @@ export const getZubyInternalConfig = async (configFilePath, cache = true) => {
         return zubyInternalConfig;
     const zubyConfig = await getZubyConfig(configFilePath);
     zubyConfig.configFilePath = configFilePath;
+    // Run config setup hook
+    await executePlugins(zubyConfig, PLUGIN_HOOKS.ZubyConfigSetup);
     validateConfig(zubyConfig);
     zubyInternalConfig = await mergeDefaultConfig(zubyConfig);
+    // Run config done hook
+    await executePlugins(zubyInternalConfig, PLUGIN_HOOKS.ZubyConfigDone);
     return zubyInternalConfig;
 };
 /**
@@ -82,6 +89,11 @@ export const mergeDefaultConfig = async (config) => {
     config.cacheDir = config.cacheDir ?? '.zuby-cache';
     config.output = config.output ?? 'static';
     config.prerenderPaths = config.prerenderPaths ?? [];
+    config.plugins = await normalizePlugins([
+        ...getBuiltInPlugins(),
+        ...(config.jsx?.getPlugins() ?? []),
+        ...(config.plugins ?? []),
+    ]);
     // Default server config
     config.server = config.server ?? {};
     config.server.host = config.server.host ?? '127.0.0.1';
@@ -116,19 +128,15 @@ export const mergeDefaultConfig = async (config) => {
     config.vite.build.ssrEmitAssets = config.vite.build.ssrEmitAssets ?? true;
     config.vite.build.modulePreload = { polyfill: false };
     config.vite.optimizeDeps = config.vite.optimizeDeps ?? {};
-    // Merge built-in plugins with user plugins
-    config.vite.plugins = [
-        ...getBuiltInPlugins(),
-        ...(config.jsx?.getPlugins() ?? []),
-        ...(config.vite?.plugins ?? []),
-    ];
+    // Merge Vite plugins with Zuby plugins
+    config.vite.plugins = [...(config.plugins ?? []), ...(config.vite.plugins ?? [])];
     return {
         ...config,
         templateExtensions: ['js', 'jsx', 'ts', 'tsx'],
     };
 };
 /**
- * This function returns the array of built-in Zuby plugins.
+ * This function returns the array of built-in plugins.
  * Check which framework components are relying on each plugin
  * before removing any of them.
  */
@@ -139,5 +147,60 @@ export const getBuiltInPlugins = () => {
         chunkNamingPlugin(),
         manifestPlugin(),
         prerenderPlugin(),
+        standaloneBuildPlugin(),
     ];
 };
+/**
+ * Executes the Zuby plugins for the given hook.
+ * @param config The ZubyConfig or ZubyInternalConfig object.
+ * @param hookName The name of the hook to execute.
+ * @param params Additional params to pass to the plugins.
+ * @param beforeHook Callback function to execute before each plugin hook.
+ * @param afterHook Callback function to execute after each plugin hook.
+ * @example executePlugins(config, 'zuby:config:setup', { config, logger })
+ */
+export const executePlugins = async (config, hookName, params = {}, beforeHook = () => { }, afterHook = () => { }) => {
+    const logger = config.customLogger ||
+        createLogger(config.logLevel, {
+            allowClearScreen: false,
+            prefix: '[Zuby]',
+        });
+    const command = process.env.NODE_ENV === 'production' ? 'build' : 'dev';
+    const plugins = config.plugins || [];
+    for (const plugin of plugins) {
+        // Skip if the plugin is not an object
+        // or if it doesn't have hooks
+        if (!plugin || !('hooks' in plugin))
+            continue;
+        const zubyPlugin = plugin;
+        const hooks = zubyPlugin?.hooks || {};
+        const hook = hooks[hookName];
+        // Skip if the hook has invalid type
+        if (!hook || typeof hook !== 'function')
+            continue;
+        // Execute the callback function before each hook
+        await beforeHook(zubyPlugin);
+        // Execute the hook
+        const hookResult = await hook({
+            ...params,
+            config,
+            logger,
+            command,
+        });
+        // Execute the callback function after each hook
+        await afterHook(zubyPlugin, hookResult);
+    }
+};
+/**
+ * Normalizes the plugins to common array format.
+ * @param plugins
+ */
+export const normalizePlugins = async (plugins) => {
+    // Resolve the plugins if they are promises
+    const resolvePlugins = await Promise.resolve(plugins);
+    return resolvePlugins
+        // Flatten the array and normalize inner arrays
+        .flatMap(plugin => (Array.isArray(plugin) ? normalizePlugins(plugin) : [plugin]))
+        // Remove false, undefined, null values
+        .filter(plugin => !!plugin);
+};

package/constants.d.ts

@@ -7,6 +7,7 @@ export declare const HTTP_HEADERS: {
     Age: string;
     Host: string;
     Server: string;
+    UserAgent: string;
     ContentType: string;
     ContentLength: string;
     ContentRange: string;

package/constants.js

@@ -9,6 +9,7 @@ export const HTTP_HEADERS = {
     Age: 'Age',
     Host: 'Host',
     Server: 'Server',
+    UserAgent: 'User-Agent',
     ContentType: 'Content-Type',
     ContentLength: 'Content-Length',
     ContentRange: 'Content-Range',

package/context/index.d.ts

@@ -15,5 +15,9 @@ export declare class ZubyContext {
     get version(): string | undefined;
     get renderToStream(): import("../types.js").RenderToStream | undefined;
     get renderToString(): import("../types.js").RenderToString | undefined;
+    get i18n(): {
+        locales: string[];
+        defaultLocale: string;
+    } | undefined;
 }
 export declare const getContext: () => ZubyContext;

package/context/index.js

@@ -20,6 +20,9 @@ export class ZubyContext {
     get renderToString() {
         return this.rawContext.render?.renderToString;
     }
+    get i18n() {
+        return this.rawContext.i18n;
+    }
 }
 const getRawContext = () => {
     return globalThis.ZubyRawContext;

package/context/types.d.ts

@@ -34,4 +34,15 @@ export interface ZubyRawContext {
      * @example 1.0.0
      */
     version?: string;
+    /**
+     * The internalization config from ZubyConfig.
+     * @example {
+     *   locales: ['en', 'de', 'cs', 'pl'],
+     *   defaultLocale: 'en'
+     * }
+     */
+    i18n?: {
+        locales: string[];
+        defaultLocale: string;
+    };
 }

package/defineConfig.d.ts

@@ -4,10 +4,12 @@ import { ZubyConfig } from './types.js';
  *
  * It is not required, but it provides type safety and autocompletion in your IDE.
  * See the full Zuby Configuration API Documentation
+ *
+ * @link https://zuby.futrou.com/reference/configuration
  * @param config
  * @example defineConfig({
  *   outDir: 'build',
  *   srcDir: './',
  * })
  */
-export declare const defineConfig: (config: ZubyConfig) => ZubyConfig;
+export declare const defineConfig: (config: ZubyConfig | (() => ZubyConfig | Promise<ZubyConfig>)) => ZubyConfig | Promise<ZubyConfig>;

package/defineConfig.js

@@ -3,6 +3,8 @@
  *
  * It is not required, but it provides type safety and autocompletion in your IDE.
  * See the full Zuby Configuration API Documentation
+ *
+ * @link https://zuby.futrou.com/reference/configuration
  * @param config
  * @example defineConfig({
  *   outDir: 'build',
@@ -10,5 +12,8 @@
  * })
  */
 export const defineConfig = (config) => {
+    if (typeof config === 'function') {
+        return config();
+    }
     return config;
 };

package/examples/basic/js/pages/index.jsx

@@ -12,14 +12,14 @@ export default function Home() {
       </p>
       <ul role="list" className="link-card-grid">
         <Card
-          href="https://zuby.futrou.com/docs"
+          href="https://zuby.futrou.com"
           title="Documentation"
           body="Find config API, tips and tricks, and more in the Zuby.js docs."
         />
         <Card
-          href="https://zuby.futrou.com/examples"
-          title="Examples"
-          body="See what's possible to build with Zuby.js by browsing examples."
+          href="https://zuby.futrou.com/reference/configuration"
+          title="API Reference"
+          body="Find config API, tips and tricks, and more in the Zuby.js API docs."
         />
       </ul>
     </main>

package/examples/basic/ts/pages/index.tsx

@@ -12,14 +12,14 @@ export default function Home() {
       </p>
       <ul role="list" className="link-card-grid">
         <Card
-          href="https://zuby.futrou.com/docs"
+          href="https://zuby.futrou.com"
           title="Documentation"
           body="Find config API, tips and tricks, and more in the Zuby.js docs."
         />
         <Card
-          href="https://zuby.futrou.com/examples"
-          title="Examples"
-          body="See what's possible to build with Zuby.js by browsing examples."
+          href="https://zuby.futrou.com/reference/configuration"
+          title="API Reference"
+          body="Find config API, tips and tricks, and more in the Zuby.js API docs."
         />
       </ul>
     </main>

package/index.d.ts

@@ -1,3 +1,7 @@
 export * from './types.js';
-export * from './config.js';
 export * from './defineConfig.js';
+export * from './context/index.js';
+export * from './pageContext/index.js';
+export { ZubyContext as Context } from './context/index.js';
+export { ZubyPageContext as PageContext } from './pageContext/index.js';
+export { ZubyPageContext as HandlerContext } from './pageContext/index.js';

package/index.js

@@ -1,3 +1,7 @@
 export * from './types.js';
-export * from './config.js';
 export * from './defineConfig.js';
+export * from './context/index.js';
+export * from './pageContext/index.js';
+export { ZubyContext as Context } from './context/index.js';
+export { ZubyPageContext as PageContext } from './pageContext/index.js';
+export { ZubyPageContext as HandlerContext } from './pageContext/index.js';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "zuby",
-  "version": "1.0.41",
+  "version": "1.0.43",
   "description": "Zuby.js is framework for building SPA apps using Vite",
   "type": "module",
   "main": "index.js",