From fd0f322576a81f47f5ad0944e440c92216312048 Mon Sep 17 00:00:00 2001 From: dominikg Date: Tue, 7 Jun 2022 22:42:34 +0200 Subject: [PATCH 1/3] feat: automatic handling for kit.browser.hydrate config --- .changeset/five-dogs-care.md | 5 ++++ packages/e2e-tests/kit-node/package.json | 2 +- packages/vite-plugin-svelte/package.json | 1 + .../vite-plugin-svelte/src/utils/options.ts | 29 +++++++++++++++++-- pnpm-lock.yaml | 24 +++++++++++++-- 5 files changed, 55 insertions(+), 6 deletions(-) create mode 100644 .changeset/five-dogs-care.md diff --git a/.changeset/five-dogs-care.md b/.changeset/five-dogs-care.md new file mode 100644 index 000000000..b7a228c32 --- /dev/null +++ b/.changeset/five-dogs-care.md @@ -0,0 +1,5 @@ +--- +'@sveltejs/vite-plugin-svelte': minor +--- + +Automate setting of compilerOptions.hydratable from kit.browser.hydrate option diff --git a/packages/e2e-tests/kit-node/package.json b/packages/e2e-tests/kit-node/package.json index fd4255664..7ec5e1eb1 100644 --- a/packages/e2e-tests/kit-node/package.json +++ b/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", diff --git a/packages/vite-plugin-svelte/package.json b/packages/vite-plugin-svelte/package.json index 7df26b787..54ab4f8ec 100644 --- a/packages/vite-plugin-svelte/package.json +++ b/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", diff --git a/packages/vite-plugin-svelte/src/utils/options.ts b/packages/vite-plugin-svelte/src/utils/options.ts index 21a0d7a69..47645ef66 100644 --- a/packages/vite-plugin-svelte/src/utils/options.ts +++ b/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); + setKitOptions(merged); addExtraPreprocessors(merged, viteConfig); enforceOptionsForHmr(merged); enforceOptionsForProduction(merged); @@ -195,6 +197,22 @@ function removeIgnoredOptions(options: ResolvedOptions) { } } +function setKitOptions(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 +494,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; } /** diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index c70764c3f..0e5d25ebd 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -248,7 +248,7 @@ importers: packages/e2e-tests/kit-node: specifiers: '@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 @@ -257,7 +257,7 @@ importers: typescript: ^4.7.3 devDependencies: '@sveltejs/adapter-node': 1.0.0-next.78 - '@sveltejs/kit': 1.0.0-next.348_svelte@3.48.0 + '@sveltejs/kit': 1.0.0-next.350_svelte@3.48.0 e2e-test-dep-svelte-api-only: link:../_test_dependencies/svelte-api-only e2e-test-dep-vite-plugins: link:../_test_dependencies/vite-plugins svelte: 3.48.0 @@ -445,6 +445,7 @@ importers: packages/vite-plugin-svelte: specifiers: '@rollup/pluginutils': ^4.2.1 + '@sveltejs/kit': ^1.0.0-next.350 '@types/debug': ^4.1.7 '@types/diff-match-patch': ^1.0.32 debug: ^4.3.4 @@ -466,6 +467,7 @@ importers: magic-string: 0.26.2 svelte-hmr: 0.14.12_svelte@3.48.0 devDependencies: + '@sveltejs/kit': 1.0.0-next.350_svelte@3.48.0 '@types/debug': 4.1.7 '@types/diff-match-patch': 1.0.32 diff-match-patch: 1.0.5 @@ -930,6 +932,24 @@ packages: - stylus dev: true + /@sveltejs/kit/1.0.0-next.350_svelte@3.48.0: + resolution: {integrity: sha512-qkZNjp7yIj6t91+wMhmMtGJH0Lb89OaKdVXUDy92CS5/4OHRTKcQPdfOKs4no/upkS3RiFb+rEpOkYqTMcPUXg==} + engines: {node: '>=16.7'} + hasBin: true + peerDependencies: + svelte: ^3.44.0 + dependencies: + '@sveltejs/vite-plugin-svelte': link:packages/vite-plugin-svelte + chokidar: 3.5.3 + sade: 1.8.1 + svelte: 3.48.0 + vite: 2.9.10 + transitivePeerDependencies: + - less + - sass + - stylus + dev: true + /@svitejs/changesets-changelog-github-compact/0.1.1: resolution: {integrity: sha512-eBi211CfmKtkxB6tINicaDPBMbolswPbaAy7kCx+uUFL/LxztLm9cB+7jP54TgCrv+mMz8vSJWIs/baH63PjsA==} engines: {node: ^12.20 || ^14.13.1 || >= 16} From 5a0bc354f79d15b48ea5b7a3b77ee867a9e9e69a Mon Sep 17 00:00:00 2001 From: dominikg Date: Tue, 7 Jun 2022 23:05:45 +0200 Subject: [PATCH 2/3] fix: improve function name and add comment --- packages/vite-plugin-svelte/src/utils/options.ts | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/packages/vite-plugin-svelte/src/utils/options.ts b/packages/vite-plugin-svelte/src/utils/options.ts index 47645ef66..b71a0e79e 100644 --- a/packages/vite-plugin-svelte/src/utils/options.ts +++ b/packages/vite-plugin-svelte/src/utils/options.ts @@ -117,7 +117,7 @@ export function resolveOptions( const merged: ResolvedOptions = mergeConfigs(defaultOptions, preResolveOptions, extraOptions); removeIgnoredOptions(merged); - setKitOptions(merged); + addSvelteKitOptions(merged); addExtraPreprocessors(merged, viteConfig); enforceOptionsForHmr(merged); enforceOptionsForProduction(merged); @@ -197,7 +197,8 @@ function removeIgnoredOptions(options: ResolvedOptions) { } } -function setKitOptions(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 ( From 54c01dc154f19d09226c6d021e79956ac3b8dfb6 Mon Sep 17 00:00:00 2001 From: dominikg Date: Tue, 7 Jun 2022 23:17:21 +0200 Subject: [PATCH 3/3] chore: fix spelling --- packages/vite-plugin-svelte/src/utils/options.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/vite-plugin-svelte/src/utils/options.ts b/packages/vite-plugin-svelte/src/utils/options.ts index b71a0e79e..368c34209 100644 --- a/packages/vite-plugin-svelte/src/utils/options.ts +++ b/packages/vite-plugin-svelte/src/utils/options.ts @@ -497,7 +497,7 @@ export interface Options { experimental?: ExperimentalOptions; /** - * Options for sveltekit + * Options for SvelteKit */ kit?: KitConfig; }