react-cosmos 6.0.0-alpha.0 → 6.0.0-alpha.11

package/bin/cosmos-export.js

@@ -3,9 +3,7 @@
 // Set the env before any code reads it
 process.env.NODE_ENV = process.env.NODE_ENV || 'production';
 
-const { generateExport } = await import(
-  '../dist/server/export/generateExport.js'
-);
+const { generateExport } = await import('../dist/export/generateExport.js');
 
 generateExport().catch(err => {
   console.log('[Cosmos] Export failed...');

package/bin/cosmos-native.js

@@ -3,9 +3,7 @@
 // Set the env before any code reads it
 process.env.NODE_ENV = process.env.NODE_ENV || 'development';
 
-const { startDevServer } = await import(
-  '../dist/server/devServer/startDevServer.js'
-);
+const { startDevServer } = await import('../dist/devServer/startDevServer.js');
 
 startDevServer('native').catch(err => {
   console.log('[Cosmos] Server crashed...');

package/bin/cosmos.js

@@ -3,9 +3,7 @@
 // Set the env before any code reads it
 process.env.NODE_ENV = process.env.NODE_ENV || 'development';
 
-const { startDevServer } = await import(
-  '../dist/server/devServer/startDevServer.js'
-);
+const { startDevServer } = await import('../dist/devServer/startDevServer.js');
 
 // Auto disable Fast Refresh in CRA 4 until integration is implemented
 // https://github.com/react-cosmos/react-cosmos/issues/1272

package/config.schema.json

@@ -50,6 +50,12 @@
       "type": "string",
       "minLength": 1
     },
+    "ignore": {
+      "description": "Patterns for ignoring fixture and decorator files (eg. [\"**/dist/**\"]]).",
+      "type": "array",
+      "items": { "type": "string", "minLength": 1 },
+      "uniqueItems": true
+    },
     "watchDirs": {
       "description": "Directories where the Cosmos server watches for fixture files changes while running. [default: [\".\"]]",
       "type": "array",
@@ -72,6 +78,10 @@
       "description": "Dev server port. [default: 5000]",
       "type": "number"
     },
+    "portRetries": {
+      "description": "Max number of port retries. [default: 10]",
+      "type": "number"
+    },
     "https": {
       "description": "Server will be served over HTTPS",
       "type": "boolean"

package/dist/corePlugins/httpProxy.d.ts

@@ -0,0 +1,2 @@
+import { CosmosServerPlugin } from '../cosmosPlugin/types.js';
+export declare const httpProxyServerPlugin: CosmosServerPlugin;

package/dist/corePlugins/httpProxy.js

@@ -0,0 +1,21 @@
+import { createProxyMiddleware } from 'http-proxy-middleware';
+export const httpProxyServerPlugin = {
+    name: 'httpProxy',
+    devServer({ platformType, cosmosConfig, expressApp }) {
+        if (platformType !== 'web')
+            return;
+        const httpProxyConfig = getHttpProxyCosmosConfig(cosmosConfig);
+        Object.keys(httpProxyConfig).forEach(context => {
+            const config = httpProxyConfig[context];
+            if (typeof config === 'string') {
+                expressApp.use(context, createProxyMiddleware(context, { target: config }));
+            }
+            else if (typeof config === 'object') {
+                expressApp.use(context, createProxyMiddleware(context, config));
+            }
+        });
+    },
+};
+function getHttpProxyCosmosConfig(cosmosConfig) {
+    return (cosmosConfig.httpProxy || {});
+}

package/dist/corePlugins/index.d.ts

@@ -0,0 +1,2 @@
+import { CosmosServerPlugin } from '../cosmosPlugin/types.js';
+export declare const coreServerPlugins: CosmosServerPlugin[];

package/dist/corePlugins/index.js

@@ -0,0 +1,12 @@
+import { httpProxyServerPlugin } from './httpProxy.js';
+import { openFileServerPlugin } from './openFile.js';
+import { pluginEndpointServerPlugin } from './pluginEndpoint.js';
+import { portRetryServerPlugin } from './portRetry.js';
+import { userDepsFileServerPlugin } from './userDepsFile.js';
+export const coreServerPlugins = [
+    portRetryServerPlugin,
+    userDepsFileServerPlugin,
+    httpProxyServerPlugin,
+    openFileServerPlugin,
+    pluginEndpointServerPlugin,
+];

package/dist/corePlugins/openFile.d.ts

@@ -0,0 +1,2 @@
+import { CosmosServerPlugin } from '../cosmosPlugin/types.js';
+export declare const openFileServerPlugin: CosmosServerPlugin;

package/dist/corePlugins/openFile.js

@@ -0,0 +1,56 @@
+import launchEditor from '@skidding/launch-editor';
+import fs from 'fs';
+import open from 'open';
+import path from 'path';
+export const openFileServerPlugin = {
+    name: 'openFile',
+    devServer({ cosmosConfig, expressApp }) {
+        expressApp.get('/_open', (req, res) => {
+            const { filePath, line, column } = getReqQuery(req);
+            if (!filePath) {
+                res.status(400).send(`File path missing`);
+                return;
+            }
+            const absFilePath = resolveFilePath(cosmosConfig.rootDir, filePath);
+            if (!fs.existsSync(absFilePath)) {
+                res.status(404).send(`File not found at path: ${absFilePath}`);
+                return;
+            }
+            new Promise((resolve, reject) => {
+                const file = `${absFilePath}:${line}:${column}`;
+                launchEditor(file, (fileName, errorMsg) => reject(errorMsg));
+                // If launchEditor doesn't report error within 500ms we assume it worked
+                setTimeout(resolve, 500);
+            })
+                // Fall back to open in case launchEditor fails. launchEditor only works
+                // when the editor app is already open, but is favorable because it can
+                // open a code file on a specific line & column.
+                .catch(err => open(absFilePath))
+                .catch(err => res.status(500).send('Failed to open file'))
+                .then(() => res.send());
+        });
+    },
+};
+function getReqQuery(req) {
+    const { filePath, line, column } = req.query;
+    if (typeof filePath !== 'string')
+        throw new Error('filePath missing');
+    return {
+        filePath,
+        line: typeof line === 'string' ? parseInt(line, 10) : 1,
+        column: typeof column === 'string' ? parseInt(column, 10) : 1,
+    };
+}
+function resolveFilePath(rootDir, filePath) {
+    // This heuristic is needed because the open file endpoint is used for
+    // multiple applications, which provide different file path types:
+    // 1. Edit fixture button: Sends path relative to Cosmos rootDir
+    // 2. react-error-overlay runtime error: Sends absolute path
+    // 3. react-error-overlay compile error: Sends path relative to CWD
+    if (path.isAbsolute(filePath)) {
+        return filePath;
+    }
+    const cosmosRelPath = path.join(rootDir, filePath);
+    const cwdRelPath = path.join(process.cwd(), filePath);
+    return fs.existsSync(cosmosRelPath) ? cosmosRelPath : cwdRelPath;
+}

package/dist/corePlugins/pluginEndpoint.d.ts

@@ -0,0 +1,2 @@
+import { CosmosServerPlugin } from '../cosmosPlugin/types.js';
+export declare const pluginEndpointServerPlugin: CosmosServerPlugin;

package/dist/corePlugins/pluginEndpoint.js

@@ -0,0 +1,22 @@
+import path from 'node:path';
+import { resolveSilent } from '../utils/resolveSilent.js';
+export const pluginEndpointServerPlugin = {
+    name: 'pluginEndpoint',
+    devServer({ cosmosConfig, expressApp }) {
+        expressApp.get('/_plugin/*.js', (req, res) => {
+            const modulePath = req.params['0'];
+            if (!modulePath) {
+                res.sendStatus(404);
+                return;
+            }
+            // The module path is always absolute, but Windows paths don't start
+            // with a slash (e.g. C:\foo\bar.js)
+            const resolvedPath = resolveSilent(path.isAbsolute(modulePath) ? modulePath : `/${modulePath}`);
+            if (!resolvedPath) {
+                res.sendStatus(404);
+                return;
+            }
+            res.sendFile(resolvedPath);
+        });
+    },
+};

package/dist/corePlugins/portRetry.d.ts

@@ -0,0 +1,2 @@
+import { CosmosServerPlugin } from '../cosmosPlugin/types.js';
+export declare const portRetryServerPlugin: CosmosServerPlugin;

package/dist/corePlugins/portRetry.js

@@ -0,0 +1,11 @@
+import { findNextAvailablePort } from '../shared/findNextAvailablePort.js';
+export const portRetryServerPlugin = {
+    name: 'portRetry',
+    async config({ cosmosConfig }) {
+        const { port, portRetries } = cosmosConfig;
+        return {
+            ...cosmosConfig,
+            port: portRetries ? await findNextAvailablePort(port, portRetries) : port,
+        };
+    },
+};

package/dist/corePlugins/userDepsFile.d.ts

@@ -0,0 +1,2 @@
+import { CosmosServerPlugin } from '../cosmosPlugin/types.js';
+export declare const userDepsFileServerPlugin: CosmosServerPlugin;

package/dist/{server/devServer/corePlugins → corePlugins}/userDepsFile.js

@@ -1,21 +1,24 @@
 import fs from 'fs/promises';
 import path from 'path';
-import { startFixtureWatcher } from '../../userDeps/fixtureWatcher.js';
-import { getPlaygroundUrl } from '../../shared/playgroundUrl.js';
-import { generateUserDepsModule } from '../../userDeps/generateUserDepsModule.js';
-import { getCliArgs } from '../../utils/cli.js';
-export async function userDepsFileDevServerPlugin(args) {
-    if (!shouldGenerateUserDepsFile(args.platformType))
-        return;
-    const { cosmosConfig } = args;
-    await generateUserDepsFile(cosmosConfig);
-    const watcher = await startFixtureWatcher(cosmosConfig, 'all', () => {
-        generateUserDepsFile(cosmosConfig);
-    });
-    return () => {
-        watcher.close();
-    };
-}
+import { getPlaygroundUrl } from '../shared/playgroundUrl.js';
+import { startFixtureWatcher } from '../userDeps/fixtureWatcher.js';
+import { generateUserDepsModule } from '../userDeps/generateUserDepsModule.js';
+import { getCliArgs } from '../utils/cli.js';
+export const userDepsFileServerPlugin = {
+    name: 'userDepsFile',
+    async devServer(args) {
+        if (!shouldGenerateUserDepsFile(args.platformType))
+            return;
+        const { cosmosConfig } = args;
+        await generateUserDepsFile(cosmosConfig);
+        const watcher = await startFixtureWatcher(cosmosConfig, 'all', () => {
+            generateUserDepsFile(cosmosConfig);
+        });
+        return () => {
+            watcher.close();
+        };
+    },
+};
 function shouldGenerateUserDepsFile(platformType) {
     return (platformType === 'native' ||
         // CLI support for --external-userdeps flag (useful with react-native-web)

package/dist/{server/cosmosConfig → cosmosConfig}/createCosmosConfig.js

@@ -14,13 +14,16 @@ export function createCosmosConfig(rootDir, cosmosConfigInput = {}) {
         hostname: getHostname(cosmosConfigInput),
         https: getHttps(cosmosConfigInput),
         httpsOptions: getHttpsOptions(cosmosConfigInput, rootDir),
+        ignore: getIgnore(cosmosConfigInput),
         port: getPort(cosmosConfigInput),
+        portRetries: getPortRetries(cosmosConfigInput),
         plugins: getPlugins(cosmosConfigInput, rootDir),
         publicUrl: getPublicUrl(cosmosConfigInput),
         staticPath: getStaticPath(cosmosConfigInput, rootDir),
         userDepsFilePath: getUserDepsFilePath(cosmosConfigInput, rootDir),
         watchDirs: getWatchDirs(cosmosConfigInput, rootDir),
         rendererUrl: cosmosConfigInput.rendererUrl ?? null,
+        dom: getDomConfig(cosmosConfigInput.dom || {}),
         ui: cosmosConfigInput.ui || {},
     };
 }
@@ -46,6 +49,9 @@ function getHttpsOptions(cosmosConfigInput, rootDir) {
     }
     return null;
 }
+function getIgnore({ ignore = [] }) {
+    return ['**/node_modules/**', ...ignore];
+}
 function getPublicUrl({ publicUrl = '/' }) {
     return publicUrl;
 }
@@ -74,6 +80,9 @@ function getPort(cosmosConfigInput) {
     const { port = 5000 } = cosmosConfigInput;
     return port;
 }
+function getPortRetries({ portRetries = 10 }) {
+    return portRetries;
+}
 function getGlobalImports(cosmosConfigInput, rootDir) {
     const { globalImports = [] } = cosmosConfigInput;
     return globalImports.map(globalImport => resolveLoose(rootDir, globalImport));
@@ -82,3 +91,9 @@ function getPlugins(cosmosConfigInput, rootDir) {
     const { plugins = [] } = cosmosConfigInput;
     return plugins.map(plugin => resolveLoose(rootDir, plugin));
 }
+function getDomConfig(cosmosConfigInput) {
+    const { containerQuerySelector = null } = cosmosConfigInput;
+    return {
+        containerQuerySelector,
+    };
+}

package/dist/{server/cosmosConfig → cosmosConfig}/shared.js

@@ -1,7 +1,7 @@
-import { importModule } from '../utils/fs.js';
+import { importJson } from '../utils/fs.js';
 export function getCurrentDir() {
     return process.cwd();
 }
 export async function importConfigFile(cosmosConfigPath) {
-    return importModule(cosmosConfigPath);
+    return importJson(cosmosConfigPath);
 }

package/dist/{server/cosmosConfig → cosmosConfig}/types.d.ts

@@ -2,17 +2,23 @@ interface HttpsOptions {
     keyPath: string;
     certPath: string;
 }
+export type CosmosDomConfig = {
+    containerQuerySelector: null | string;
+};
 export type CosmosConfig = {
     exportPath: string;
     detectLocalPlugins: boolean;
     disablePlugins: boolean;
+    dom: CosmosDomConfig;
     fixtureFileSuffix: string;
     fixturesDir: string;
     globalImports: string[];
     hostname: null | string;
     https: boolean;
     httpsOptions: null | HttpsOptions;
+    ignore: string[];
     port: number;
+    portRetries: number;
     plugins: string[];
     publicUrl: string;
     rendererUrl: string | null;
@@ -25,5 +31,6 @@ export type CosmosConfig = {
         [pluginName: string]: {};
     };
 };
+export type CosmosDomConfigInput = Partial<CosmosDomConfig>;
 export type CosmosConfigInput = Partial<CosmosConfig>;
 export {};

package/dist/{server/cosmosPlugin → cosmosPlugin}/pluginConfigs.js

@@ -9,7 +9,7 @@ export async function getPluginConfigs({ cosmosConfig, relativePaths, }) {
         return moduleConfigs;
     const localConfigs = await findCosmosPluginConfigs({
         rootDir,
-        ignore: [`${exportPath}/**`],
+        ignore: ['**/node_modules/**', `${exportPath}/**`],
         relativePaths,
     });
     return [...moduleConfigs, ...localConfigs];

package/dist/{server/cosmosPlugin → cosmosPlugin}/readCosmosPluginConfig.js

@@ -1,8 +1,8 @@
 import path from 'path';
-import { importModule } from '../utils/fs.js';
+import { importJson } from '../utils/fs.js';
 import { resolveSilent } from '../utils/resolveSilent.js';
 export async function readCosmosPluginConfig({ rootDir, configPath, relativePaths, }) {
-    const rawConfig = await importModule(configPath);
+    const rawConfig = await importJson(configPath);
     const pluginRootDir = path.dirname(configPath);
     const config = {
         name: rawConfig.name,
@@ -13,11 +13,8 @@ export async function readCosmosPluginConfig({ rootDir, configPath, relativePath
     if (rawConfig.ui) {
         config.ui = resolvePluginPath(config.name, rootDir, pluginRootDir, rawConfig.ui, relativePaths);
     }
-    if (rawConfig.devServer) {
-        config.devServer = resolvePluginPath(config.name, rootDir, pluginRootDir, rawConfig.devServer, relativePaths);
-    }
-    if (rawConfig.export) {
-        config.export = resolvePluginPath(config.name, rootDir, pluginRootDir, rawConfig.export, relativePaths);
+    if (rawConfig.server) {
+        config.server = resolvePluginPath(config.name, rootDir, pluginRootDir, rawConfig.server, relativePaths);
     }
     return config;
 }

package/dist/{server/cosmosPlugin → cosmosPlugin}/types.d.ts

@@ -4,6 +4,11 @@ import http from 'http';
 import { MessageType } from 'react-cosmos-core';
 import { CosmosConfig } from '../cosmosConfig/types.js';
 export type PlatformType = 'web' | 'native';
+export type CosmosConfigPluginArgs = {
+    cosmosConfig: CosmosConfig;
+    platformType: PlatformType;
+};
+export type CosmosConfigPlugin = (args: CosmosConfigPluginArgs) => Promise<CosmosConfig> | CosmosConfig;
 export type DevServerPluginArgs = {
     cosmosConfig: CosmosConfig;
     platformType: PlatformType;
@@ -19,3 +24,9 @@ export type ExportPluginArgs = {
     cosmosConfig: CosmosConfig;
 };
 export type ExportPlugin = (args: ExportPluginArgs) => unknown;
+export type CosmosServerPlugin = {
+    name: string;
+    config?: CosmosConfigPlugin;
+    devServer?: DevServerPlugin;
+    export?: ExportPlugin;
+};

package/dist/{server/devServer → devServer}/messageHandler.d.ts

@@ -3,5 +3,5 @@ import http from 'http';
 import { ServerMessage } from 'react-cosmos-core';
 export declare function createMessageHandler(httpServer: http.Server): {
     sendMessage: (msg: ServerMessage) => void;
-    cleanUp: () => void;
+    close: () => void;
 };

package/dist/{server/devServer → devServer}/messageHandler.js

@@ -21,9 +21,9 @@ export function createMessageHandler(httpServer) {
             }
         });
     }
-    function cleanUp() {
+    function close() {
         wss.clients.forEach(client => client.close());
         wss.close();
     }
-    return { sendMessage, cleanUp };
+    return { sendMessage, close };
 }

package/dist/{server/devServer → devServer}/startDevServer.js

@@ -1,24 +1,15 @@
 import path from 'path';
+import { coreServerPlugins } from '../corePlugins/index.js';
 import { detectCosmosConfig, detectCosmosConfigPath, } from '../cosmosConfig/detectCosmosConfig.js';
 import { getPluginConfigs } from '../cosmosPlugin/pluginConfigs.js';
+import { importServerPlugins } from '../shared/importServerPlugins.js';
 import { logPluginInfo } from '../shared/logPluginInfo.js';
-import { requirePluginModule } from '../shared/requirePluginModule.js';
 import { serveStaticDir } from '../shared/staticServer.js';
-import { httpProxyDevServerPlugin } from './corePlugins/httpProxy.js';
-import openFileDevServerPlugin from './corePlugins/openFile.js';
-import pluginEndpointDevServerPlugin from './corePlugins/pluginEndpoint.js';
-import { userDepsFileDevServerPlugin } from './corePlugins/userDepsFile.js';
 import { createExpressApp } from './expressApp.js';
 import { createHttpServer } from './httpServer.js';
 import { createMessageHandler } from './messageHandler.js';
-const builtInPlugins = [
-    userDepsFileDevServerPlugin,
-    httpProxyDevServerPlugin,
-    openFileDevServerPlugin,
-    pluginEndpointDevServerPlugin,
-];
 export async function startDevServer(platformType) {
-    const cosmosConfig = await detectCosmosConfig();
+    let cosmosConfig = await detectCosmosConfig();
     logCosmosConfigInfo();
     const pluginConfigs = await getPluginConfigs({
         cosmosConfig,
@@ -28,19 +19,36 @@ export async function startDevServer(platformType) {
         relativePaths: false,
     });
     logPluginInfo(pluginConfigs);
+    const userPlugins = await importServerPlugins(pluginConfigs, cosmosConfig.rootDir);
+    const plugins = [...coreServerPlugins, ...userPlugins];
+    for (const plugin of plugins) {
+        if (plugin.config) {
+            try {
+                cosmosConfig = await plugin.config({ cosmosConfig, platformType });
+            }
+            catch (err) {
+                console.log(`[Cosmos][plugin:${plugin.name}] Config hook failed`);
+                throw err;
+            }
+        }
+    }
     const app = await createExpressApp(platformType, cosmosConfig, pluginConfigs);
     const httpServer = await createHttpServer(cosmosConfig, app);
     const msgHandler = createMessageHandler(httpServer.server);
+    // Make Playground available as soon as possible and show a loading screen
+    // while plugins are initializing
+    await httpServer.start();
     const pluginCleanupCallbacks = [];
     async function cleanUp() {
         await Promise.all(pluginCleanupCallbacks.map(cleanup => cleanup()));
+        msgHandler.close();
         await httpServer.stop();
-        msgHandler.cleanUp();
     }
-    const userPlugins = await getDevServerPlugins(pluginConfigs, cosmosConfig.rootDir);
-    for (const plugin of [...builtInPlugins, ...userPlugins]) {
+    for (const plugin of plugins) {
         try {
-            const pluginReturn = await plugin({
+            if (!plugin.devServer)
+                continue;
+            const pluginReturn = await plugin.devServer({
                 cosmosConfig,
                 platformType,
                 httpServer: httpServer.server,
@@ -55,7 +63,7 @@ export async function startDevServer(platformType) {
                     catch (err) {
                         // Log when a plugin fails to clean up, but continue to attempt
                         // to clean up the remaining plugins
-                        console.log(`[Cosmos][${plugin.name}] Dev server plugin cleanup failed`);
+                        console.log(`[Cosmos][plugin:${plugin.name}] Dev server cleanup failed`);
                         console.log(err);
                     }
                 });
@@ -64,7 +72,7 @@ export async function startDevServer(platformType) {
         catch (err) {
             // Abort starting server if a plugin init fails and attempt cleanup of all
             // plugins that have already initialized
-            console.log(`[Cosmos][${plugin.name}] Dev server plugin init failed`);
+            console.log(`[Cosmos][plugin:${plugin.name}] Dev server init failed`);
             cleanUp();
             throw err;
         }
@@ -72,7 +80,6 @@ export async function startDevServer(platformType) {
     if (cosmosConfig.staticPath) {
         serveStaticDir(app, cosmosConfig.staticPath, cosmosConfig.publicUrl);
     }
-    await httpServer.start();
     return cleanUp;
 }
 function logCosmosConfigInfo() {
@@ -84,8 +91,3 @@ function logCosmosConfigInfo() {
     const relConfigPath = path.relative(process.cwd(), cosmosConfigPath);
     console.log(`[Cosmos] Using cosmos config found at ${relConfigPath}`);
 }
-async function getDevServerPlugins(pluginConfigs, rootDir) {
-    return Promise.all(pluginConfigs
-        .filter(pluginConfig => pluginConfig.devServer)
-        .map(pluginConfig => requirePluginModule(rootDir, pluginConfig, 'devServer')));
-}

package/dist/{server/export → export}/generateExport.js

@@ -1,16 +1,17 @@
 import fs from 'fs/promises';
 import path from 'path';
 import { removeLeadingSlash, } from 'react-cosmos-core';
+import { coreServerPlugins } from '../corePlugins/index.js';
 import { detectCosmosConfig } from '../cosmosConfig/detectCosmosConfig.js';
 import { getPluginConfigs } from '../cosmosPlugin/pluginConfigs.js';
+import { importServerPlugins } from '../shared/importServerPlugins.js';
 import { logPluginInfo } from '../shared/logPluginInfo.js';
 import { getExportPlaygroundHtml } from '../shared/playgroundHtml.js';
-import { requirePluginModule } from '../shared/requirePluginModule.js';
 import { getStaticPath } from '../shared/staticPath.js';
 import { resolve } from '../utils/resolve.js';
-const builtInPlugins = [];
 export async function generateExport() {
-    const cosmosConfig = await detectCosmosConfig();
+    const platformType = 'web';
+    let cosmosConfig = await detectCosmosConfig();
     const pluginConfigs = await getPluginConfigs({
         cosmosConfig,
         // Relative paths work in exports because all plugin modules are copied
@@ -18,19 +19,34 @@ export async function generateExport() {
         relativePaths: true,
     });
     logPluginInfo(pluginConfigs);
+    const userPlugins = await importServerPlugins(pluginConfigs, cosmosConfig.rootDir);
+    const plugins = [...coreServerPlugins, ...userPlugins];
+    for (const plugin of plugins) {
+        if (plugin.config) {
+            try {
+                cosmosConfig = await plugin.config({ cosmosConfig, platformType });
+            }
+            catch (err) {
+                console.log(`[Cosmos][plugin:${plugin.name}] Config hook failed`);
+                throw err;
+            }
+        }
+    }
     // Clear previous export (or other files at export path)
     const { exportPath } = cosmosConfig;
     await fs.rm(exportPath, { recursive: true, force: true });
+    await fs.mkdir(exportPath, { recursive: true });
     // Copy static assets first, so that the built index.html overrides the its
     // template file (in case the static assets are served from the root path)
     await copyStaticAssets(cosmosConfig);
-    const userPlugins = await getExportPlugins(pluginConfigs, cosmosConfig.rootDir);
-    for (const plugin of [...builtInPlugins, ...userPlugins]) {
+    for (const plugin of plugins) {
+        if (!plugin.export)
+            continue;
         try {
-            await plugin({ cosmosConfig });
+            await plugin.export({ cosmosConfig });
         }
         catch (err) {
-            console.log(`[Cosmos][${plugin.name}] Export plugin failed`);
+            console.log(`[Cosmos][plugin:${plugin.name}] Export failed`);
             throw err;
         }
     }
@@ -59,11 +75,6 @@ async function copyStaticAssets(cosmosConfig) {
     const exportStaticPath = path.resolve(exportPath, removeLeadingSlash(publicUrl));
     fs.cp(staticPath, exportStaticPath, { recursive: true });
 }
-async function getExportPlugins(pluginConfigs, rootDir) {
-    return Promise.all(pluginConfigs
-        .filter(pluginConfig => pluginConfig.export)
-        .map(pluginConfig => requirePluginModule(rootDir, pluginConfig, 'export')));
-}
 async function exportPlaygroundFiles(cosmosConfig, pluginConfigs) {
     const { exportPath } = cosmosConfig;
     // Copy UI plugins to export path and embed them in the playground HTML

package/dist/{server/getFixtures → getFixtures}/getFixtures.js

@@ -1,7 +1,7 @@
 import path from 'path';
 import { createFixtureTree, flattenFixtureTree, getDecoratedFixtureElement, getFixtureListFromExports, getSortedDecoratorsForFixturePath, stringifyPlaygroundUrlQuery, stringifyRendererUrlQuery, } from 'react-cosmos-core';
 import { RENDERER_FILENAME } from '../shared/playgroundHtml.js';
-import { resolveUrlPath } from '../shared/resolveUrlPath.js';
+import { resolveRendererUrl } from '../shared/resolveRendererUrl.js';
 import { getUserModules } from '../userDeps/getUserModules.js';
 export function getFixtures(cosmosConfig) {
     const { fixturesDir, fixtureFileSuffix, rootDir } = cosmosConfig;
@@ -47,8 +47,8 @@ function getRendererUrl(cosmosConfig, fixtureId) {
     if (rendererUrl)
         return `${rendererUrl}?${query}`;
     const host = getPlaygroundHost(cosmosConfig);
-    const urlPath = resolveUrlPath(publicUrl, RENDERER_FILENAME);
-    return `${host}${urlPath}?${query}`;
+    const urlPath = resolveRendererUrl(publicUrl, RENDERER_FILENAME);
+    return new URL(`${urlPath}?${query}`, host).toString();
 }
 function getPlaygroundHost({ hostname, port, https }) {
     return `${https ? 'https' : 'http'}://${hostname || 'localhost'}:${port}`;

package/dist/index.d.ts

@@ -0,0 +1,21 @@
+export * from './cosmosConfig/createCosmosConfig.js';
+export * from './cosmosConfig/detectCosmosConfig.js';
+export * from './cosmosConfig/getCosmosConfigAtPath.js';
+export * from './cosmosConfig/types.js';
+export * from './cosmosPlugin/findCosmosPluginConfigs.js';
+export * from './cosmosPlugin/pluginConfigs.js';
+export * from './cosmosPlugin/types.js';
+export * from './getFixtures/getFixtures.js';
+export * from './shared/findNextAvailablePort.js';
+export { RENDERER_FILENAME } from './shared/playgroundHtml.js';
+export * from './shared/playgroundUrl.js';
+export * from './shared/staticServer.js';
+export * from './testHelpers/cwd.js';
+export * from './userDeps/fixtureWatcher.js';
+export * from './userDeps/generateUserDepsModule.js';
+export * from './utils/cli.js';
+export * from './utils/fs.js';
+export * from './utils/requireSilent.js';
+export * from './utils/resolve.js';
+export * from './utils/resolveLoose.js';
+export * from './utils/resolveSilent.js';