aboutsummaryrefslogtreecommitdiffstats
path: root/subprojects/frontend/vite.config.ts
blob: 63d5245f3830e2a45ee906efe79e878454b2c078 (plain) (blame)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
/*
 * SPDX-FileCopyrightText: 2021-2023 The Refinery Authors <https://refinery.tools/>
 *
 * SPDX-License-Identifier: EPL-2.0
 */

import path from 'node:path';
import { fileURLToPath } from 'node:url';

import { lezer } from '@lezer/generator/rollup';
import react from '@vitejs/plugin-react-swc';
import { defineConfig, type UserConfig as ViteConfig } from 'vite';
import { VitePWA } from 'vite-plugin-pwa';

import { CONFIG_ENDPOINT } from './config/backendConfigVitePlugin';
import detectDevModeOptions, {
  API_ENDPOINT,
} from './config/detectDevModeOptions';
import fetchPackageMetadata from './config/fetchPackageMetadata';
import graphvizUMDVitePlugin from './config/graphvizUMDVitePlugin';
import manifest from './config/manifest';
import minifyHTMLVitePlugin from './config/minifyHTMLVitePlugin';
import preloadFontsVitePlugin from './config/preloadFontsVitePlugin';

const thisDir = path.dirname(fileURLToPath(import.meta.url));

const { mode, isDevelopment, devModePlugins, serverOptions } =
  detectDevModeOptions();

process.env['NODE_ENV'] ??= mode;

const fontsGlob = [
  'open-sans-latin-wdth-{normal,italic}-*.woff2',
  'jetbrains-mono-latin-wght-{normal,italic}-*.woff2',
];

const viteConfig: ViteConfig = {
  logLevel: 'info',
  mode,
  root: thisDir,
  cacheDir: path.join(thisDir, 'build/vite/cache'),
  plugins: [
    react(),
    lezer(),
    preloadFontsVitePlugin(fontsGlob),
    minifyHTMLVitePlugin(),
    graphvizUMDVitePlugin(),
    VitePWA({
      strategies: 'generateSW',
      registerType: 'prompt',
      injectRegister: null,
      workbox: {
        globPatterns: ['**/*.{css,html,js}', ...fontsGlob],
        dontCacheBustURLsMatching: /\.(?:css|js|woff2?)$/,
        navigateFallbackDenylist: [new RegExp(`^\\/${API_ENDPOINT}$`)],
        runtimeCaching: [
          {
            urlPattern: CONFIG_ENDPOINT,
            handler: 'StaleWhileRevalidate',
          },
        ],
      },
      includeAssets: ['apple-touch-icon.png', 'favicon.svg'],
      manifest,
    }),
    ...devModePlugins,
  ],
  base: '',
  define: {
    __DEV__: JSON.stringify(isDevelopment), // For MobX
  },
  build: {
    assetsDir: '.',
    // If we don't control inlining manually, web fonts will be randomly inlined
    // into the CSS, which degrades performance.
    assetsInlineLimit: 0,
    outDir: path.join('build/vite', mode),
    emptyOutDir: true,
    sourcemap: isDevelopment,
    minify: !isDevelopment,
  },
  server: serverOptions,
};

export default defineConfig(async () => {
  await fetchPackageMetadata(thisDir);
  return viteConfig;
});