Gravity/vite.config.js at main · NoGenryFord/Gravity · 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
/*
 * vite configuration file:
 * 1. defines project root, base path, and public directory
 * 2. sets a global variable for compatibility
 * 3. specifies cache directory for faster rebuilds
 * 4. configures CSS processing with Tailwind, Autoprefixer, and Sass paths
 * 5. resolves '@' alias to the 'src' directory
 * 6. configures dev server port and filesystem permissions
 * 7. defines build output directory, sourcemaps, minification, and target
 * 8. customizes asset output naming and splits vendor modules into chunks
 * 9. sets a warning limit for large chunk sizes
 * 10. configures vitest for unit testing with jsdom and global APIs
 */

import { defineConfig } from "vite";
import path, { dirname } from "path";
import { fileURLToPath } from "url";

import { assetFileNamer, chunkSplitter } from "./conf";

// derive __dirname in ESM
const __filename = fileURLToPath(import.meta.url);
const __dirname = dirname(__filename);

export default defineConfig({
  root: ".", // project root directory
  base: "/Gravity/", // base public path
  publicDir: "public", // directory for static assets

  define: {
    global: "window", // polyfill global for legacy libraries
  },

  cacheDir: "node_modules/.vite", // directory for Vite cache

  css: {
    postcss: {
      //   plugins: [
      //     tailwindcss({ config: tailwindConfig }), // tailwind CSS
      //     autoprefixer(), // vendor prefixing
      //   ],
    },
    preprocessorOptions: {
      scss: {
        includePaths: ["src/sass"], // sass include directory
      },
    },
  },

  resolve: {
    alias: {
      "@": path.resolve(__dirname, "./src"), // shortcut to src folder
      "@js": path.resolve(__dirname, "./src/js"),
    },
  },

  server: {
    port: 5173, // dev server port
    // fs: {
    //   allow: ["src", "public", "node_modules"], // allow serving files from parent directory
    // },
  },

  preview: {
    port: 4173, // preview port
  },

  build: {
    outDir: "dist", // build output folder
    emptyOutDir: true, // clean outDir before building
    sourcemap: false, // generate source maps
    minify: "esbuild", // minification tool
    target: "es2024", // JS target for transpilation
    esbuild: {
      legalComments: "none", // remove license comments
    },
    commonjsOptions: {
      transformMixedEsModules: true, // support mixed ES/CommonJS
    },
    rollupOptions: {
      output: {
        entryFileNames: "js/[name]/[hash].js", // entry chunk naming
        chunkFileNames: "js/[name]/[hash].js", // code-split chunk naming
        assetFileNames: ({ name }) => assetFileNamer({ name }), // asset naming based on type
        manualChunks: (id) => chunkSplitter(id), // custom chunk splitting for vendor modules
      },
    },
    chunkSizeWarningLimit: 2000, // warn if chunk > 2000kB
  },

  envDir: ".", // directory where .env files are loaded from
  envPrefix: "VITE_", // prefix to filter and expose env variables
});