Trilium/apps/client/vite.config.mts

/// <reference types='vitest' />
import { codecovVitePlugin } from '@codecov/vite-plugin';
import prefresh from '@prefresh/vite';
import { join } from 'path';
import { defineConfig } from 'vite';
import { viteStaticCopy } from 'vite-plugin-static-copy'

import { shareTheme, stripUniverEmojiData, stripUniverHyphenation } from './vite-plugins.mjs';

const assets = [ "assets", "stylesheets", "fonts", "translations" ];

const isDev = process.env.NODE_ENV === "development";
let plugins: any = [];

if (isDev) {
    plugins = [
        // Prefresh keeps a growing list of vnodes per component type and scans it on every diff, so
        // a view with thousands of instances of one component slows to a stop. Set TRILIUM_NO_HMR to
        // work on such a view; components then reload with the page instead of in place.
        ...(process.env.TRILIUM_NO_HMR ? [] : [ prefresh() ]),
        stripUniverHyphenation(),
        stripUniverEmojiData(),
        ...shareTheme()
    ];
} else {
    plugins = [
        stripUniverHyphenation(),
        stripUniverEmojiData(),
        ...shareTheme(),
        viteStaticCopy({
            targets: assets.map((asset) => ({
                src: `src/${asset}/**/*`,
                dest: asset,
                rename: { stripBase: 2 }
            }))
        }),
        viteStaticCopy({
            targets: [
                {
                    src: "../../node_modules/@excalidraw/excalidraw/dist/prod/fonts/**/*",
                    dest: "",
                }
            ]
        }),
        // Put the Codecov vite plugin after all other plugins
        codecovVitePlugin({
            enableBundleAnalysis: process.env.CODECOV_TOKEN !== undefined,
            bundleName: "client",
            uploadToken: process.env.CODECOV_TOKEN
        })
    ]
}

export default defineConfig(() => ({
    root: import.meta.dirname,
    cacheDir: '../../.cache/vite',
    base: "",
    plugins,
    // Use oxc for JSX transformation (Vite 8+ replaced the deprecated `esbuild` option with `oxc`)
    oxc: {
        jsx: {
            runtime: 'automatic',
            importSource: 'preact',
            development: isDev
        }
    },
    css: {
        transformer: 'lightningcss',
        devSourcemap: isDev
    },
    server: {
        watch: {
            ignored: ["**/test-output/**"]
        }
    },
    resolve: {
        alias: [
            {
                find: "react",
                replacement: "preact/compat"
            },
            {
                find: "react-dom",
                replacement: "preact/compat"
            }
        ],
        dedupe: [
            "react",
            "react-dom",
            "preact",
            "preact/compat",
            "preact/hooks"
        ]
    },
    optimizeDeps: {
        include: [
            "ckeditor5",
            "mathlive"
        ]
    },
    build: {
        target: "esnext",
        outDir: './dist',
        emptyOutDir: true,
        reportCompressedSize: true,
        sourcemap: false,
        rollupOptions: {
            input: {
                index: join(import.meta.dirname, "index.html"),
                runtime: join(import.meta.dirname, "src", "runtime.ts"),
                print: join(import.meta.dirname, "src", "print.tsx")
            },
            output: {
                entryFileNames: (chunk) => {
                    // We enforce a hash in the main index file to avoid caching issues, this only works because we have the HTML entry point.
                    if (chunk.name === "index" || chunk.name === "print") {
                        return "src/[name]-[hash].js";
                    }

                    // For EJS-rendered pages (e.g. login) we need to have a stable name.
                    return "src/[name].js";
                },
                chunkFileNames: "src/[name]-[hash].js",
                assetFileNames: "src/[name]-[hash].[ext]"
            },
            onwarn(warning, rollupWarn) {
                if (warning.code === "MODULE_LEVEL_DIRECTIVE") {
                    return;
                }
                rollupWarn(warning);
            }
        }
    },
    test: {
        environment: "happy-dom",
        // Vitest skips CSS processing by default, which would hand `?inline` importers an empty
        // string. The presentation themes are SCSS compiled through that path, so their specs need
        // it on to assert against real rules.
        css: { include: [/\.scss(\?|$)/] },
        setupFiles: [
            "./src/test/setup.ts"
        ],
        server: {
            deps: {
                // The plugin reads `rrule` through a namespace import, which Node resolves to the
                // package's CommonJS build with no named exports. Bundling it applies Vite's interop.
                inline: ["@fullcalendar/rrule"]
            }
        },
        reporters: [
            "verbose",
            ["html", { outputFile: "./test-output/vitest/html/index.html" }],
            ["junit", { outputFile: "./test-output/vitest/junit.xml", addFileAttribute: true }]
        ],
        coverage: {
            reportsDirectory: "./test-output/vitest/coverage",
            provider: "v8" as const,
            // Codecov resolves an lcov `SF:` path by matching it against the repo's file list.
            // Vitest defaults the lcov reporter's `projectRoot` to the Vite `root`, which would
            // emit app-relative paths (`src/…`); the shallow ones are ambiguous in this monorepo
            // and get attributed to whichever project wins the match. Anchor to the repo root so
            // every path is unambiguous.
            reporter: ["text", "html", ["lcov", { projectRoot: join(import.meta.dirname, "../..") }]],
            include: ["src/**/*.{ts,tsx}"],
            // Benchmarks are measured by `vitest bench`, which the test run never invokes, so a
            // `*.bench.ts` left in scope reports as wholly uncovered source.
            exclude: ["**/*.{test,spec}.{ts,mts,cts,tsx,js,jsx}", "**/*.bench.{ts,mts,cts,tsx}", "**/*.d.ts"]
        },
    },
    commonjsOptions: {
        transformMixedEsModules: true,
    },
    define: {
        "process.env.IS_PREACT": JSON.stringify("true"),
    }
}));