// vite.config.ts
import { enhancedImages } from "@sveltejs/enhanced-img";
import { sveltekit } from "@sveltejs/kit/vite";
import path from "node:path";
import type { UserConfig } from "vite";
import { kitRoutes } from "vite-plugin-kit-routes";
import browserslist from "browserslist";
import { browserslistToTargets } from "lightningcss";
import devtoolsJson from "vite-plugin-devtools-json";

const $src = path.resolve(__dirname, "./src");
const $db = path.resolve($src, "./types/supabase.ts");
const $lib = path.resolve($src, "./lib");
const $routes = path.resolve($src, "./routes");
const $scripts = path.resolve($lib, "./scripts");
const $stores = path.resolve($scripts, "./stores");
const $images = path.resolve($lib, "./images");
const $components = path.resolve($lib, "./components");
const $containers = path.resolve($components, "./containers");
const $navigation = path.resolve($components, "./navigation");
const $classes = path.resolve($scripts, "./classes");

const config: UserConfig = {
	plugins: [
		devtoolsJson(),
		enhancedImages(),
		sveltekit(),
		kitRoutes({
			format: "variables",
		}),
	],
	server: {
		open: true,
	},
	resolve: {
		alias: {
			$db,
			$scripts,
			$routes,
			$stores,
			$images,
			$classes,
			$components,
			$containers,
			$navigation,
		},
	},

	optimizeDeps: {
		exclude: ["svelte-inspect-value"],
	},
	build: {
		sourcemap: true,
		target: "esnext",
		cssMinify: "lightningcss",
	},
	css: {
		transformer: "lightningcss",
		lightningcss: {
			targets: browserslistToTargets(browserslist("defaults, not ie 11")),
		},
	},
};

export default config;