feat: automatic handling for kit.browser.hydrate config (#368)

* feat: automatic handling for kit.browser.hydrate config

* fix: improve function name and add comment

* chore: fix spelling

Author: dominikg

.changeset/five-dogs-care.md

@@ -0,0 +1,5 @@
+---
+'@sveltejs/vite-plugin-svelte': minor
+---
+
+Automate setting of compilerOptions.hydratable from kit.browser.hydrate option

packages/e2e-tests/kit-node/package.json

@@ -13,7 +13,7 @@
   },
   "devDependencies": {
     "@sveltejs/adapter-node": "^1.0.0-next.78",
-    "@sveltejs/kit": "^1.0.0-next.348",
+    "@sveltejs/kit": "^1.0.0-next.350",
     "e2e-test-dep-svelte-api-only": "workspace:*",
     "e2e-test-dep-vite-plugins": "workspace:*",
     "svelte": "^3.48.0",

packages/vite-plugin-svelte/package.json

@@ -64,6 +64,7 @@
     }
   },
   "devDependencies": {
+    "@sveltejs/kit": "^1.0.0-next.350",
     "@types/debug": "^4.1.7",
     "@types/diff-match-patch": "^1.0.32",
     "diff-match-patch": "^1.0.5",

packages/vite-plugin-svelte/src/utils/options.ts

@@ -11,14 +11,16 @@ import { log } from './log';
 import { loadSvelteConfig } from './load-svelte-config';
 import { SVELTE_HMR_IMPORTS, SVELTE_IMPORTS, SVELTE_RESOLVE_MAIN_FIELDS } from './constants';
 // eslint-disable-next-line node/no-missing-import
-import { CompileOptions, Warning } from 'svelte/types/compiler/interfaces';
-import {
+import type { CompileOptions, Warning } from 'svelte/types/compiler/interfaces';
+import type {
 	MarkupPreprocessor,
 	Preprocessor,
 	PreprocessorGroup,
 	Processed
 	// eslint-disable-next-line node/no-missing-import
 } from 'svelte/types/compiler/preprocess';
+// eslint-disable-next-line node/no-missing-import
+import type { KitConfig } from '@sveltejs/kit';
 import path from 'path';
 import { findRootSvelteDependencies, needsOptimization, SvelteDependency } from './dependencies';
 import { createRequire } from 'module';
@@ -76,7 +78,6 @@ export async function preResolveOptions(
 		inlineOptions,
 		extraOptions
 	);
-
 	// configFile of svelteConfig contains the absolute path it was loaded from,
 	// prefer it over the possibly relative inline path
 	if (svelteConfig?.configFile) {
@@ -116,6 +117,7 @@ export function resolveOptions(
 	const merged: ResolvedOptions = mergeConfigs(defaultOptions, preResolveOptions, extraOptions);
 
 	removeIgnoredOptions(merged);
+	addSvelteKitOptions(merged);
 	addExtraPreprocessors(merged, viteConfig);
 	enforceOptionsForHmr(merged);
 	enforceOptionsForProduction(merged);
@@ -195,6 +197,23 @@ function removeIgnoredOptions(options: ResolvedOptions) {
 	}
 }
 
+// some SvelteKit options need compilerOptions to work, so set them here.
+function addSvelteKitOptions(options: ResolvedOptions) {
+	if (options?.kit != null) {
+		const hydratable = options.kit.browser?.hydrate !== false;
+		if (
+			options.compilerOptions.hydratable != null &&
+			options.compilerOptions.hydratable !== hydratable
+		) {
+			log.warn(
+				`Conflicting values "compilerOptions.hydratable: ${options.compilerOptions.hydratable}" and "kit.browser.hydrate: ${options.kit.browser?.hydrate}" in your svelte config. You should remove "compilerOptions.hydratable".`
+			);
+		}
+		log.debug(`Setting compilerOptions.hydratable: ${hydratable} for SvelteKit`);
+		options.compilerOptions.hydratable = hydratable;
+	}
+}
+
 // vite passes unresolved `root`option to config hook but we need the resolved value, so do it here
 // https://github.com/sveltejs/vite-plugin-svelte/issues/113
 // https://github.com/vitejs/vite/blob/43c957de8a99bb326afd732c962f42127b0a4d1e/packages/vite/src/node/config.ts#L293
@@ -476,6 +495,11 @@ export interface Options {
 	 * These options are considered experimental and breaking changes to them can occur in any release
 	 */
 	experimental?: ExperimentalOptions;
+
+	/**
+	 * Options for SvelteKit
+	 */
+	kit?: KitConfig;
 }
 
 /**