little-gitster-girl/vite.config.ts at main · FlorianDe/little-gitster-girl · GitHub

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
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
import { sentryVitePlugin } from "@sentry/vite-plugin";
import react from "@vitejs/plugin-react";
import process from "node:process";
import { defineConfig, loadEnv } from "vite";
import { VitePWA } from 'vite-plugin-pwa'
import { visualizer } from "rollup-plugin-visualizer";
import { displayNetworkUrlWithHostnamePlugin } from './config/vite-plugins/vite-display-network-url-hostname-plugin';
import { selfSignedHttpsSupportPlugin } from './config/vite-plugins/vite-self-signed-https-support-plugin';
import { pwaImageGenPlugin } from './config/vite-plugins/vite-pwa-image-gen-plugin';
import {fontSubsetPlugin} from './config/vite-plugins/vite-custom-font-subset-base64';

const isSentryDisabled = !(process.env.SENTRY_PLUGIN_ENABLED == "true")

const externalLibs = ['canvg', 'html2canvas', 'dompurify']; // Exclude from bundling and dependency optimization

// https://vite.dev/config/
export default ({ mode }: {mode: never}) => {
  const {
    VITE_APP_NAME
  } = loadEnv(mode, process.cwd());

  return defineConfig({
      base: "/little-gitster-girl",
      build: {
        sourcemap: true,
        rollupOptions: {
          external: externalLibs,
        },
      },
      optimizeDeps: {
        exclude: externalLibs,
      },
      plugins: [
        !isSentryDisabled && sentryVitePlugin({
          org: process.env.SENTRY_ORG,
          project: process.env.SENTRY_PROJECT,
          authToken: process.env.SENTRY_AUTH_TOKEN,
          disable: isSentryDisabled, // Seems like the sentry-vite-plugin not perfectly adapts to the disable option: https://github.com/getsentry/sentry-javascript-bundler-plugins/blob/main/packages/bundler-plugin-core/src/index.ts#L83-L101
        }),
        visualizer({
          template: "treemap",
          open: false,
          gzipSize: true,
          brotliSize: true,
          filename: "generated/analyse.html",
        }),
        react(),
        fontSubsetPlugin({
          fontPath: "./assets/fonts/NEONLEDLightRegular.ttf",
          subsetChars: Array.from(new Set(VITE_APP_NAME.toUpperCase().split(""))).join(""),
          fontFaceOptions: {
            fontFamily: "NEON LED Light",
          },
          injection: {
            type: "inject"
          }
        }),
        displayNetworkUrlWithHostnamePlugin(),
        selfSignedHttpsSupportPlugin(),
        pwaImageGenPlugin({
          outputDir: "public",
          images: [
            {
              path: "assets/logo_512x512.png",
              transparent: {
                sizes: [64, 192, 512],
              },
              maskable: {
                sizes: [512],
              },
              apple: {
                sizes: [512],
              },
              options: {
                maskable: {
                  padding: 0.0,
                  resizeOptions: { fit: "contain", background: "white" },
                },
              }
            },
          ],
          favicon: {
            path: "public/favicon.svg",
            size: 48,
          },
        }),
        VitePWA({
          registerType: "autoUpdate",
          includeAssets: ['favicon.svg'],
          manifest: {
            "short_name": VITE_APP_NAME,
            "name": VITE_APP_NAME,
            "icons": [
                {
                  src: 'pwa-64x64.png',
                  sizes: '64x64',
                  type: 'image/png'
                },
                {
                  src: 'pwa-192x192.png',
                  sizes: '192x192',
                  type: 'image/png'
                },
                {
                  src: 'pwa-512x512.png',
                  sizes: '512x512',
                  type: 'image/png',
                  purpose: 'any'
                },
                {
                  src: 'maskable-icon-512x512.png',
                  sizes: '512x512',
                  type: 'image/png',
                  purpose: 'maskable'
                }
            ],
            "start_url": ".",
            "display": "standalone",
            "theme_color": "#000000",
            "background_color": "#ffffff"
          },
          includeManifestIcons: true,
        })
      ],
      preview: {
        port: 3000,
        strictPort: true
      },
      server: {
        port: 3000,
        strictPort: true
      },
      worker: {
        format: 'es',
        rollupOptions: {
          external: externalLibs,
        },
      }
    });
};