prototypes/vite.config.ts at main · analogdotnow/prototypes · 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
import path from "node:path";
import tailwindcss from "@tailwindcss/vite";
import react from "@vitejs/plugin-react";
import jotaiDebugLabel from "jotai/babel/plugin-debug-label";
import jotaiReactRefresh from "jotai/babel/plugin-react-refresh";
import Unfonts from "unplugin-fonts/vite";
import { defineConfig } from "vite";
import ogPlugin, { type Options } from "vite-plugin-open-graph";
import svgr from "vite-plugin-svgr";

const ogOptions: Options = {
  basic: {
    url: "https://prototypes.analog.now",
    title: "Analog Prototypes",
    type: "website",
    image: "https://prototypes.analog.now/og-image.png",
    description: "A collection of UI prototypes for the Analog Calendar.",
    locale: "en_US",
    siteName: "Analog Prototypes",
  },
  twitter: {
    image: "https://prototypes.analog.now/og-image.png",
    imageAlt: "Analog Prototypes",
  },
};

// https://vitejs.dev/config/
export default defineConfig({
  base: "/",
  build: {
    outDir: "dist",
  },
  plugins: [
    react({
      babel: {
        plugins: [jotaiDebugLabel, jotaiReactRefresh],
      },
    }),
    tailwindcss(),
    svgr(),
    Unfonts({
      google: {
        families: [
          {
            name: "Geist",
            styles: "wght@400;500;600;700",
          },
          {
            name: "Geist Mono",
            styles: "wght@400;500;600;700",
          },
        ],
      },
      custom: {
        families: [
          {
            name: "Satoshi",
            local: "Satoshi",
            src: "./src/global/assets/fonts/Satoshi-*.woff2",
            transform(font) {
              font.style = "normal";
              if (font.basename === "Satoshi-Bold") {
                font.weight = 700;
              } else if (font.basename === "Satoshi-Medium") {
                font.weight = 500;
              }
              font.weight = 400;
              return font;
            },
          },
        ],
        display: "swap",
        preload: true,
      },
    }),
    ogPlugin(ogOptions),
  ],
  resolve: {
    alias: {
      "@": path.resolve(__dirname, "./src/global"),
      "~": path.resolve(__dirname, "./src/prototypes"),
    },
  },
  optimizeDeps: {
    exclude: ["lucide-react"],
  },
});