vike 0.0.0-alpha.0 → 0.4.142-commit-6eb0dd3

package/dist/esm/node/plugin/plugins/devConfig/determineOptimizeDeps.js

@@ -0,0 +1,122 @@
+export { determineOptimizeDeps };
+import { findPageFiles } from '../../shared/findPageFiles.js';
+import { assert, getFilePathAbsolute, isNotNullish, isNpmPackageImport, unique } from '../../utils.js';
+import { getVikeConfig } from '../importUserCode/v1-design/getVikeConfig.js';
+import { getConfigValueSourcesRelevant } from '../../shared/getConfigValueSource.js';
+import { analyzeClientEntries } from '../buildConfig.js';
+import { virtualFileIdImportUserCodeClientCR, virtualFileIdImportUserCodeClientSR } from '../../../shared/virtual-files/virtualFileImportUserCode.js';
+async function determineOptimizeDeps(config, configVike, isDev) {
+    const { pageConfigs } = await getVikeConfig(config.root, isDev, configVike.extensions);
+    const { entries, include } = await getPageDeps(config, pageConfigs, isDev);
+    {
+        // This actually doesn't work: Vite's dep optimizer doesn't seem to be able to crawl virtual files.
+        //  - Should we make it work? E.g. by creating a temporary file at node_modules/.vike/virtualFiles.js
+        //  - Or should we remove it? And make sure getPageDeps() also works for aliased import paths
+        //    - If we do, then we need to adjust include/entries (maybe by making include === entries -> will Vite complain?)
+        const entriesVirtualFiles = getVirtualFiles(config, pageConfigs);
+        entries.push(...entriesVirtualFiles);
+    }
+    include.push(...getExtensionsDeps(configVike));
+    /* Other Vite plugins may populate optimizeDeps, e.g. Cypress: https://github.com/vikejs/vike/issues/386
+    assert(config.optimizeDeps.entries === undefined)
+    */
+    config.optimizeDeps.include = [...include, ...normalizeInclude(config.optimizeDeps.include)];
+    config.optimizeDeps.entries = [...entries, ...normalizeEntries(config.optimizeDeps.entries)];
+    // console.log('config.optimizeDeps', config.optimizeDeps)
+}
+async function getPageDeps(config, pageConfigs, isDev) {
+    let entries = [];
+    let include = [];
+    // V1 design
+    {
+        pageConfigs.forEach((pageConfig) => {
+            const configValueSourcesRelevant = getConfigValueSourcesRelevant(pageConfig);
+            configValueSourcesRelevant.forEach((configValueSource) => {
+                const { valueIsImportedAtRuntime, configEnv, definedAtInfo } = configValueSource;
+                if (!valueIsImportedAtRuntime)
+                    return;
+                const { filePath } = definedAtInfo;
+                assert(filePath);
+                if (configEnv !== 'client-only' && configEnv !== 'server-and-client')
+                    return;
+                if (filePath.startsWith('/')) {
+                    // Is getFilePathAbsolute() really needed? This contradicts the code below that doesn't need getFilePathAbsolute().
+                    entries.push(getFilePathAbsolute(filePath, config));
+                    return;
+                }
+                // getVikeConfig() resolves relative import paths
+                assert(!filePath.startsWith('.'));
+                // We need to differentiate between npm package imports and path aliases.
+                // There are path aliases that cannot be distinguished from npm package names.
+                // We recommend users to use the '#' prefix convention for path aliases, see https://vike.dev/path-aliases#vite and assertResolveAlias()
+                if (isNpmPackageImport(filePath)) {
+                    // isNpmPackageImport() returns false for a path alias like #root/renderer/onRenderClient
+                    assert(!filePath.startsWith('#'));
+                    include.push(filePath);
+                }
+                else {
+                    /* Path aliases, e.g.:
+                     * ```js
+                     * // /renderer/+config.js
+                     * import onRenderClient from '#root/renderer/onRenderClient'
+                     * ```
+                     * Does Vite resolve the path aliases or is getFilePathAbsolute() needed?
+                     */
+                    entries.push(filePath);
+                }
+            });
+        });
+    }
+    // V0.4 design
+    {
+        const pageFiles = await findPageFiles(config, ['.page', '.page.client'], isDev);
+        pageFiles.forEach((filePath) => {
+            const entry = getFilePathAbsolute(filePath, config);
+            entries.push(entry);
+        });
+    }
+    entries = unique(entries);
+    include = unique(include);
+    return { entries, include };
+}
+function getVirtualFiles(config, pageConfigs) {
+    const { hasClientRouting, hasServerRouting, clientEntries } = analyzeClientEntries(pageConfigs, config);
+    const entriesVirtualFiles = Object.values(clientEntries);
+    if (hasClientRouting)
+        entriesVirtualFiles.push(virtualFileIdImportUserCodeClientCR);
+    if (hasServerRouting)
+        entriesVirtualFiles.push(virtualFileIdImportUserCodeClientSR);
+    return entriesVirtualFiles;
+}
+function getExtensionsDeps(configVike) {
+    return [
+        /* Doesn't work since `pageConfigsSrcDir` is a directory. We could make it work by using find-glob.
+        ...configVike.extensions
+          .map(({ pageConfigsSrcDir }) => pageConfigsSrcDir)
+          .flat()
+          .filter(isNotNullish),
+        //*/
+        ...configVike.extensions
+            .map(({ pageConfigsDistFiles }) => pageConfigsDistFiles)
+            .flat()
+            .filter(isNotNullish)
+            .filter(({ importPath }) => !importPath.endsWith('.css'))
+            .map(({ importPath }) => importPath)
+    ];
+}
+function normalizeEntries(entries) {
+    if (Array.isArray(entries))
+        return entries;
+    if (typeof entries === 'string')
+        return [entries];
+    if (entries === undefined)
+        return [];
+    assert(false);
+}
+function normalizeInclude(include) {
+    if (Array.isArray(include))
+        return include;
+    if (include === undefined)
+        return [];
+    assert(false);
+}

package/dist/esm/node/plugin/plugins/devConfig/index.d.ts

@@ -0,0 +1,3 @@
+export { devConfig };
+import type { Plugin } from 'vite';
+declare function devConfig(): Plugin[];

package/dist/esm/node/plugin/plugins/devConfig/index.js

@@ -0,0 +1,84 @@
+export { devConfig };
+import { determineOptimizeDeps } from './determineOptimizeDeps.js';
+import { determineFsAllowList } from './determineFsAllowList.js';
+import { getConfigVike } from '../../../shared/getConfigVike.js';
+import { addSsrMiddleware } from '../../shared/addSsrMiddleware.js';
+import { markEnvAsDev } from '../../utils.js';
+import { improveViteLogs } from '../../shared/loggerVite.js';
+import { isErrorDebug } from '../../shared/isErrorDebug.js';
+import { installHttpRequestAsyncStore } from '../../shared/getHttpRequestAsyncStore.js';
+if (isErrorDebug()) {
+    Error.stackTraceLimit = Infinity;
+}
+// There doesn't seem to be a straightforward way to discriminate between `$ vite preview` and `$ vite dev`
+const apply = 'serve';
+const isDev = true;
+function devConfig() {
+    let config;
+    return [
+        {
+            name: 'vike:devConfig',
+            apply,
+            config() {
+                return {
+                    optimizeDeps: {
+                        exclude: [
+                            // We exclude the vike client to be able to use `import.meta.glob()`
+                            'vike/client',
+                            'vike/client/router',
+                            'vike/routing',
+                            // - We also exclude @brillout/json-serializer and @brillout/picocolors to avoid:
+                            //   ```
+                            //   9:28:58 AM [vite] ✨ new dependencies optimized: @brillout/json-serializer/parse
+                            //   9:28:58 AM [vite] ✨ optimized dependencies changed. reloading
+                            //   ```
+                            // - Previously, we had to exclude @brillout/json-serializer and @brillout/picocolors because of pnpm, but this doesn't seem to be the case anymore.
+                            //   - Actually, this should be still the case? How can Vite resolve @brillout/json-serializer when using pnpm?
+                            '@brillout/json-serializer/parse',
+                            '@brillout/json-serializer/stringify',
+                            '@brillout/picocolors'
+                        ]
+                    }
+                };
+            },
+            async configResolved(config_) {
+                config = config_;
+                const configVike = await getConfigVike(config);
+                await determineOptimizeDeps(config, configVike, isDev);
+                await determineFsAllowList(config, configVike);
+                if (!isErrorDebug()) {
+                    await installHttpRequestAsyncStore();
+                    improveViteLogs(config);
+                }
+            },
+            configureServer() {
+                markEnvAsDev();
+            }
+        },
+        {
+            name: 'vike:devConfig:addSsrMiddleware',
+            apply,
+            // The SSR middleware should be last middleware
+            enforce: 'post',
+            configureServer: {
+                order: 'post',
+                handler(server) {
+                    if (config.server.middlewareMode)
+                        return;
+                    return () => {
+                        addSsrMiddleware(server.middlewares);
+                    };
+                }
+            },
+            // Setting `configResolved.clearScreen = false` doesn't work
+            config: {
+                order: 'post',
+                handler() {
+                    if (isErrorDebug()) {
+                        return { clearScreen: false };
+                    }
+                }
+            }
+        }
+    ];
+}

package/dist/esm/node/plugin/plugins/distFileNames.d.ts

@@ -0,0 +1,3 @@
+export { distFileNames };
+import type { Plugin } from 'vite';
+declare function distFileNames(): Plugin;

package/dist/esm/node/plugin/plugins/distFileNames.js

@@ -0,0 +1,163 @@
+export { distFileNames };
+// Attempt to preserve file structure of `.page.js` files:
+//  - https://github.com/vikejs/vike/commit/11a4c49e5403aa7c37c8020c462b499425b41854
+//  - Blocker: https://github.com/rollup/rollup/issues/4724
+import { assertPosixPath, assert, assertUsage } from '../utils.js';
+import path from 'path';
+function distFileNames() {
+    return {
+        name: 'vike:distFileNames',
+        apply: 'build',
+        enforce: 'post',
+        configResolved(config) {
+            const rollupOutputs = getRollupOutputs(config);
+            // We need to support multiple outputs: @vite/plugin-legacy adds an ouput, see https://github.com/vikejs/vike/issues/477#issuecomment-1406434802
+            rollupOutputs.forEach((rollupOutput) => {
+                if (!rollupOutput.entryFileNames) {
+                    rollupOutput.entryFileNames = (chunkInfo) => getEntryFileName(chunkInfo, config, true);
+                }
+                if (!rollupOutput.chunkFileNames) {
+                    rollupOutput.chunkFileNames = (chunkInfo) => getChunkFileName(chunkInfo, config);
+                }
+                if (!rollupOutput.assetFileNames) {
+                    rollupOutput.assetFileNames = (chunkInfo) => getAssetFileName(chunkInfo, config);
+                }
+            });
+        }
+    };
+}
+function getAssetFileName(assetInfo, config) {
+    const assetsDir = getAssetsDir(config);
+    const dir = assetsDir + '/static';
+    let { name } = assetInfo;
+    if (!name) {
+        return `${dir}/[name].[hash][extname]`;
+    }
+    // https://github.com/vikejs/vike/issues/794
+    assertPosixPath(name);
+    name = path.posix.basename(name);
+    // dist/client/assets/index.page.server.jsx_extractAssets_lang.e4e33422.css
+    // => dist/client/assets/index.page.server.e4e33422.css
+    if (
+    // Vite 2
+    name?.endsWith('_extractAssets_lang.css') ||
+        // Vite 3
+        name?.endsWith('?extractAssets&lang.css')) {
+        name = name.split('.').slice(0, -2).join('.');
+        name = clean(name);
+        return `${dir}/${name}.[hash][extname]`;
+    }
+    name = name.split('.').slice(0, -1).join('.');
+    name = clean(name);
+    return `${dir}/${name}.[hash][extname]`;
+}
+function getChunkFileName(_chunkInfo, config) {
+    const isForClientSide = !config.build.ssr;
+    let name = 'chunks/chunk-[hash].js';
+    if (isForClientSide) {
+        const assetsDir = getAssetsDir(config);
+        name = `${assetsDir}/${name}`;
+    }
+    return name;
+}
+function getEntryFileName(chunkInfo, config, isEntry) {
+    const assetsDir = getAssetsDir(config);
+    const isForClientSide = !config.build.ssr;
+    let { name } = chunkInfo;
+    assertPosixPath(name);
+    name = clean(name, true, 
+    // Not needed for client-side because dist/ filenames contain `.[hash].js`
+    !isForClientSide);
+    if (isForClientSide) {
+        return `${assetsDir}/${name}.[hash].js`;
+    }
+    else {
+        return `${name}.${isEntry ? 'mjs' : 'js'}`;
+    }
+}
+function removePathSeperators(name) {
+    assertPosixPath(name);
+    assert(!name.startsWith('/'));
+    const entryDir = 'entries/';
+    const hasEntryDir = name.startsWith(entryDir);
+    if (hasEntryDir) {
+        name = name.slice(entryDir.length);
+        assert(!name.startsWith('/'));
+    }
+    name = name.split('/').join('_');
+    if (hasEntryDir) {
+        name = `${entryDir}${name}`;
+    }
+    return name;
+}
+function clean(name, removePathSep, fixGlob) {
+    name = fixExtractAssetsQuery(name);
+    if (fixGlob) {
+        name = workaroundGlob(name);
+    }
+    name = replaceNonLatinCharaters(name);
+    if (removePathSep) {
+        name = removePathSeperators(name);
+    }
+    name = removeLeadingUnderscoreInFilename(name);
+    name = removeUnderscoreDoublets(name);
+    return name;
+}
+function fixExtractAssetsQuery(name) {
+    name = name.replace(/\.[^\.]*_extractAssets_lang$/, '.extractAssets');
+    return name;
+}
+function removeUnderscoreDoublets(name) {
+    name = name.split(/__+/).join('_');
+    return name;
+}
+function replaceNonLatinCharaters(name) {
+    name = name.split('+').join('');
+    name = name.replace(/[^a-zA-Z0-9\/\._]/g, '-');
+    return name;
+}
+// Remove leading `_` from filename
+//  - GitHub Pages treat URLs with filename starting with `_` differently (removing the need for workaround of creating a .jekyll file)
+function removeLeadingUnderscoreInFilename(name) {
+    assertPosixPath(name);
+    const paths = name.split('/');
+    {
+        const last = paths.length - 1;
+        let filename = paths[last];
+        if (filename.startsWith('_')) {
+            filename = filename.slice(1);
+            paths[last] = filename;
+            name = paths.join('/');
+        }
+    }
+    return name;
+}
+// Ensure import.meta.glob() doesn't match dist/ files
+function workaroundGlob(name) {
+    // V1 design
+    name = name.split('+').join('');
+    ['client', 'server', 'route'].forEach((env) => {
+        name = name.split(`.page.${env}`).join(`-page-${env}`);
+    });
+    name = name.split('.page.').join('-page.');
+    name = name.replace(/\.page$/, '-page');
+    return name;
+}
+function getRollupOutputs(config) {
+    var _a, _b;
+    // @ts-expect-error is read-only
+    config.build ?? (config.build = {});
+    (_a = config.build).rollupOptions ?? (_a.rollupOptions = {});
+    (_b = config.build.rollupOptions).output ?? (_b.output = {});
+    const { output } = config.build.rollupOptions;
+    if (!Array.isArray(output)) {
+        return [output];
+    }
+    return output;
+}
+function getAssetsDir(config) {
+    let { assetsDir } = config.build;
+    assertUsage(assetsDir, `${assetsDir} cannot be an empty string`);
+    assetsDir = assetsDir.split(/\/|\\/).filter(Boolean).join('/');
+    return assetsDir;
+}

package/dist/esm/node/plugin/plugins/envVars.d.ts

@@ -0,0 +1,3 @@
+export { envVarsPlugin };
+import type { Plugin } from 'vite';
+declare function envVarsPlugin(): Plugin;

package/dist/esm/node/plugin/plugins/envVars.js

@@ -0,0 +1,81 @@
+export { envVarsPlugin };
+import { loadEnv } from 'vite';
+import { assert, assertPosixPath, assertUsage, assertWarning, getFilePathVite, lowerFirst } from '../utils.js';
+function envVarsPlugin() {
+    let envsAll;
+    let config;
+    return {
+        name: 'vike:env',
+        enforce: 'post',
+        configResolved(config_) {
+            config = config_;
+            config.command;
+            envsAll = loadEnv(config.mode, config.envDir || config.root, '');
+            config.plugins.sort(lowerFirst((plugin) => (plugin.name === 'vite:define' ? 1 : 0)));
+        },
+        transform(code, id, options) {
+            assertPosixPath(id);
+            if (id.includes('/node_modules/'))
+                return;
+            if (!id.startsWith(config.root))
+                return;
+            if (!code.includes('import.meta.env.'))
+                return;
+            const isBuild = config.command === 'build';
+            const isClientSide = getIsClientSide(config, options);
+            Object.entries(envsAll)
+                .filter(([key]) => {
+                // Already handled by Vite
+                const envPrefix = !config.envPrefix
+                    ? []
+                    : Array.isArray(config.envPrefix)
+                        ? config.envPrefix
+                        : [config.envPrefix];
+                return !envPrefix.some((prefix) => key.startsWith(prefix));
+            })
+                .forEach(([key, val]) => {
+                const varName = `import.meta.env.${key}`;
+                const publicPrefix = 'PUBLIC_ENV__';
+                const keyPublic = `${publicPrefix}${key}`;
+                const isPrivate = !key.startsWith(publicPrefix);
+                if (isPrivate && isClientSide) {
+                    if (!code.includes(varName))
+                        return;
+                    const filePathVite = getFilePathVite(id, config.root);
+                    const errMsgAddendum = isBuild
+                        ? ''
+                        : ' (vike will prevent your app from building for production)';
+                    const errMsg = `${varName} used in ${filePathVite} and therefore included in client-side bundle which can be be a security leak${errMsgAddendum}, remove ${varName} or rename ${key} to ${keyPublic}, see https://vike.dev/env`;
+                    if (isBuild) {
+                        assertUsage(false, errMsg);
+                    }
+                    else {
+                        // Only a warning for faster development DX (e.g. when use toggles `ssr: boolean` or `onBeforeRenderIsomorph: boolean`)
+                        assertWarning(false, errMsg, { onlyOnce: true });
+                    }
+                }
+                assert(!(isPrivate && isClientSide) || !isBuild);
+                code = code.replaceAll(varName, JSON.stringify(val));
+            });
+            // No need for low-resolution source map since line numbers didn't change. (Does Vite do high-resolution column numbers source mapping?)
+            return code;
+        }
+    };
+}
+function getIsClientSide(config, options) {
+    const isBuild = config.command === 'build';
+    if (isBuild) {
+        assert(typeof config.build.ssr === 'boolean');
+        const isServerSide = config.build.ssr;
+        if (options !== undefined) {
+            assert(options.ssr === isServerSide);
+        }
+        return !isServerSide;
+    }
+    else {
+        assert(config.build.ssr === false);
+        assert(typeof options?.ssr === 'boolean');
+        const isServerSide = options.ssr;
+        return !isServerSide;
+    }
+}

package/dist/esm/node/plugin/plugins/extensionsAssets.d.ts

@@ -0,0 +1,3 @@
+export { extensionsAssets };
+import type { Plugin } from 'vite';
+declare function extensionsAssets(): Plugin;

package/dist/esm/node/plugin/plugins/extensionsAssets.js

@@ -0,0 +1,95 @@
+export { extensionsAssets };
+import { assert, isScriptFile, assertUsage, assertPosixPath, getOutDirs } from '../utils.js';
+import fs from 'fs';
+import path from 'path';
+import sirv from 'sirv';
+import { getConfigVike } from '../../shared/getConfigVike.js';
+import { isAsset } from '../shared/isAsset.js';
+const ASSET_DIR = 'assets';
+function extensionsAssets() {
+    let config;
+    let extensionsAssetsDir;
+    return {
+        name: 'vike:extensionsAssets',
+        async configResolved(config_) {
+            config = config_;
+            const configVike = await getConfigVike(config);
+            extensionsAssetsDir = getExtensionsAssetsDir(config, configVike);
+        },
+        configureServer(server) {
+            if (extensionsAssetsDir.length > 0) {
+                return () => {
+                    serveExtensionsAssets(server.middlewares, extensionsAssetsDir, config);
+                };
+            }
+        },
+        writeBundle() {
+            if (!config.build.ssr && extensionsAssetsDir.length > 0) {
+                copyExtensionsAssetsDir(config, extensionsAssetsDir);
+            }
+        }
+    };
+}
+function serveExtensionsAssets(middlewares, extensionsAssetsDirs, config) {
+    assert(ASSET_DIR === getAsssetsDirConfig(config));
+    extensionsAssetsDirs.forEach((assetsDir) => {
+        const serve = sirv(assetsDir);
+        middlewares.use(async (req, res, next) => {
+            if (!req.url?.startsWith(`/${ASSET_DIR}/`)) {
+                next();
+                return;
+            }
+            // https://github.com/lukeed/sirv/issues/148 - [Feature Request] New option base.
+            req.url = '/' + req.url.slice(`/${ASSET_DIR}/`.length);
+            serve(req, res, next);
+        });
+    });
+}
+function getExtensionsAssetsDir(config, configVike) {
+    const { extensions } = configVike;
+    const extensionsWithAssetsDir = extensions.filter(({ assetsDir }) => assetsDir);
+    if (0 === extensionsWithAssetsDir.length)
+        return [];
+    assertUsage(ASSET_DIR === getAsssetsDirConfig(config), 'Cannot modify vite.config.js#build.assetsDir while using ' + extensionsWithAssetsDir[0].npmPackageName);
+    const extensionsAssetsDir = extensionsWithAssetsDir.map(({ assetsDir }) => {
+        assert(assetsDir);
+        assertPosixPath(assetsDir);
+        return assetsDir;
+    });
+    return extensionsAssetsDir;
+}
+function getAsssetsDirConfig(config) {
+    let { assetsDir } = config.build;
+    assertPosixPath(assetsDir);
+    assetsDir = assetsDir.split('/').filter(Boolean).join('/');
+    return assetsDir;
+}
+function copyExtensionsAssetsDir(config, extensionsAssetsDirs) {
+    assert(ASSET_DIR === getAsssetsDirConfig(config));
+    const { outDirClient } = getOutDirs(config);
+    assertPosixPath(outDirClient);
+    const outDirAssets = path.posix.join(outDirClient, ASSET_DIR);
+    extensionsAssetsDirs.forEach((assetsDir) => {
+        copyAssetFiles(assetsDir, outDirAssets);
+    });
+}
+// Adapted from https://github.com/vitejs/vite/blob/e92d025cedabb477687d6a352ee8c9b7d529f623/packages/vite/src/node/utils.ts#L589-L604
+function copyAssetFiles(srcDir, destDir) {
+    let destDirCreated = false;
+    for (const file of fs.readdirSync(srcDir)) {
+        const srcFile = path.resolve(srcDir, file);
+        const destFile = path.resolve(destDir, file);
+        const stat = fs.statSync(srcFile);
+        if (stat.isDirectory()) {
+            copyAssetFiles(srcFile, destFile);
+        }
+        else if (isAsset(srcFile)) {
+            assert(!isScriptFile(srcFile));
+            if (!destDirCreated) {
+                fs.mkdirSync(destDir, { recursive: true });
+                destDirCreated = true;
+            }
+            fs.copyFileSync(srcFile, destFile);
+        }
+    }
+}

package/dist/esm/node/plugin/plugins/extractAssetsPlugin.d.ts

@@ -0,0 +1,5 @@
+export { extractAssetsPlugin };
+export { extractAssetsRE };
+import type { Plugin } from 'vite';
+declare const extractAssetsRE: RegExp;
+declare function extractAssetsPlugin(): Plugin[];