code-explorer/vite.config.ts at main · eslint/code-explorer · 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
import path from "node:path";
import babel from "@rolldown/plugin-babel";
import { defineConfig } from "vite";
import react, { reactCompilerPreset } from "@vitejs/plugin-react";

const chunkGroups = {
	// Core React dependencies (rarely change)
	vendor: ["react", "react-dom", "zustand"],
	// Heavy parsing libraries (version-dependent)
	parsers: [
		"espree",
		"esquery",
		"@eslint/css",
		"@eslint/json",
		"@eslint/markdown",
		"@html-eslint/eslint-plugin",
		"eslint-linter-browserify",
		"eslint-scope",
	],
	// UI framework components (stable)
	ui: [
		"@radix-ui/react-accordion",
		"@radix-ui/react-dialog",
		"@radix-ui/react-dropdown-menu",
		"@radix-ui/react-label",
		"@radix-ui/react-popover",
		"@radix-ui/react-select",
		"@radix-ui/react-slot",
		"@radix-ui/react-switch",
		"@radix-ui/react-toggle",
		"@radix-ui/react-toggle-group",
	],
	// Code editor (large, separate feature)
	editor: [
		"@uiw/react-codemirror",
		"codemirror",
		"@codemirror/lang-css",
		"@codemirror/lang-html",
		"@codemirror/lang-javascript",
		"@codemirror/lang-json",
		"@codemirror/lang-markdown",
		"@codemirror/language",
		"@codemirror/view",
		"@lezer/highlight",
	],
	// Utilities and styling (frequently changing)
	utils: [
		"clsx",
		"tailwind-merge",
		"class-variance-authority",
		"lucide-react",
	],
	// Visualization libraries
	visualization: ["graphviz-react", "react-resizable-panels"],
};

const pathSeparatorPattern = String.raw`[/\\]`;
const nodeModulesPattern = `${pathSeparatorPattern}node_modules${pathSeparatorPattern}`;

function createChunkGroupPattern(dependencies: string[]) {
	return new RegExp(
		`${nodeModulesPattern}(?:${dependencies
			.map(dependency => dependency.split("/").join(pathSeparatorPattern))
			.join("|")})(?:${pathSeparatorPattern}|$)`,
	);
}

export default defineConfig({
	plugins: [
		react(),
		babel({
			presets: [reactCompilerPreset()],
		}),
	],
	resolve: {
		alias: {
			"@": path.resolve(__dirname, "src"),
		},
	},
	build: {
		outDir: "build",
		rolldownOptions: {
			output: {
				codeSplitting: {
					groups: Object.entries(chunkGroups).map(
						([chunkName, dependencies]) => ({
							name: chunkName,
							test: createChunkGroupPattern(dependencies),
						}),
					),
				},
				assetFileNames: "assets/[name]-[hash].[ext]",
				chunkFileNames: "assets/[name]-[hash].js",
				entryFileNames: "assets/[name]-[hash].js",
			},
		},
		chunkSizeWarningLimit: 1000,
	},
});