ocular/vite.config.ts at main · simonwep/ocular · 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
import { minifyHtmlPlugin } from './plugins/vite-plugin-minify-html/minifyHtmlPlugin.ts';
import { minifyJsonPlugin } from './plugins/vite-plugin-minify-json/minifyJsonPlugin.ts';
import vue from '@vitejs/plugin-vue';
import { optimizeCssModules } from 'vite-plugin-optimize-css-modules';
import { VitePWA } from 'vite-plugin-pwa';
import tsconfigPaths from 'vite-tsconfig-paths';
import { defineConfig } from 'vitest/config';
import type { ProxyOptions } from 'vite';

const base = process.env.OCULAR_BASE_URL ?? '/';

const proxy: Record<string, ProxyOptions> = {
  '/api': {
    target: 'http://localhost:8080',
    rewrite: (path) => path.slice(4) // cut off `/api`
  }
};

export default defineConfig({
  base,
  envPrefix: ['OCULAR'],
  server: { port: 3000, proxy },
  preview: { port: 3000, proxy },
  define: {
    'import.meta.env.OCULAR_BUILD_TIMESTAMP': Date.now()
  },
  resolve: {
    alias: {
      '@styles': '/src/styles'
    }
  },
  build: {
    target: 'ES2025'
  },
  plugins: [
    tsconfigPaths({ loose: true }),
    optimizeCssModules(),
    minifyJsonPlugin(),
    minifyHtmlPlugin(),
    vue(),
    VitePWA({
      manifest: {
        name: 'Ocular',
        short_name: 'Ocular',
        start_url: base,
        display: 'standalone',
        orientation: 'any',
        background_color: '#fff',
        theme_color: '#6bb1ff',
        description: 'Budgeting app',
        icons: [
          {
            src: `${base}images/icon-maskable-192x192.png`,
            sizes: '192x192',
            type: 'image/png',
            purpose: 'maskable'
          },
          {
            src: `${base}images/icon-maskable-256x256.png`,
            sizes: '256x256',
            type: 'image/png',
            purpose: 'maskable'
          },
          {
            src: `${base}images/icon-maskable-512x512.png`,
            sizes: '512x512',
            type: 'image/png',
            purpose: 'maskable'
          },
          {
            src: `${base}images/icon-maskable-1024x1024.png`,
            sizes: '1024x1024',
            type: 'image/png',
            purpose: 'maskable'
          },
          {
            src: `${base}images/icon-192x192.png`,
            sizes: '192x192',
            type: 'image/png'
          },
          {
            src: `${base}images/icon-512x512.png`,
            sizes: '512x512',
            type: 'image/png'
          },
          {
            src: `${base}images/icon-1024x1024.png`,
            sizes: '1024x1024',
            type: 'image/png'
          }
        ]
      },
      workbox: {
        globPatterns: ['**/*.{js,css,html,woff2,json}']
      }
    })
  ],
  test: {
    include: ['./src/**/*.spec.ts']
  }
});