retire vite.config.js in favour of config.kit.vite - fixes #509

examples/hn.svelte.dev/svelte.config.cjs

@@ -1,8 +1,6 @@
 module.exports = {
 	kit: {
 		adapter: '@sveltejs/adapter-netlify',
-
-		// hydrate the <div id="svelte"> element in src/app.html
 		target: '#svelte'
 	}
 };

examples/realworld.svelte.dev/svelte.config.cjs

@@ -6,6 +6,12 @@ module.exports = {
 		adapter: '@sveltejs/adapter-node',
 
 		// hydrate the <div id="svelte"> element in src/app.html
-		target: '#svelte'
+		target: '#svelte',
+
+		vite: {
+			ssr: {
+				noExternal: ['node-fetch']
+			}
+		}
 	}
 };

examples/sandbox/svelte.config.cjs

@@ -1,11 +1,16 @@
+const pkg = require('./package.json');
+
 module.exports = {
 	kit: {
-		// By default, `npm run build` will create a standard Node app.
-		// You can create optimized builds for different platforms by
-		// specifying a different adapter
 		adapter: '@sveltejs/adapter-node',
-
-		// hydrate the <div id="svelte"> element in src/app.html
-		target: '#svelte'
+		target: '#svelte',
+		vite: {
+			build: {
+				minify: false
+			},
+			ssr: {
+				noExternal: Object.keys(pkg.dependencies || {})
+			}
+		}
 	}
 };

examples/svelte-kit-demo/svelte.config.cjs

@@ -1,11 +1,6 @@
 module.exports = {
 	kit: {
-		// By default, `npm run build` will create a standard Node app.
-		// You can create optimized builds for different platforms by
-		// specifying a different adapter
 		adapter: '@sveltejs/adapter-node',
-
-		// hydrate the <div id="svelte"> element in src/app.html
 		target: '#svelte'
 	}
 };

packages/create-svelte/template/svelte.config.cjs

@@ -1,3 +1,5 @@
+const pkg = require('./package.json');
+
 /** @type {import('@sveltejs/kit').Config} */
 module.exports = {
 	kit: {
@@ -7,6 +9,12 @@ module.exports = {
 		adapter: '@sveltejs/adapter-node',
 
 		// hydrate the <div id="svelte"> element in src/app.html
-		target: '#svelte'
+		target: '#svelte',
+
+		vite: {
+			ssr: {
+				noExternal: Object.keys(pkg.dependencies || {})
+			}
+		}
 	}
 };

packages/kit/src/core/build/index.js

@@ -109,11 +109,15 @@ async function build_client({
 		});
 	});
 
-	// client build
+	/** @type {any} */
+	const user_config = config.kit.vite();
+
 	await vite.build({
+		...user_config,
 		root: cwd,
 		base,
 		build: {
+			...user_config.build,
 			cssCodeSplit: true,
 			manifest: true,
 			lib: {
@@ -126,6 +130,7 @@ async function build_client({
 			},
 			outDir: client_out_dir,
 			rollupOptions: {
+				...(user_config.build && user_config.build.rollupOptions),
 				input,
 				output: {
 					entryFileNames: '[name]-[hash].js',
@@ -136,12 +141,15 @@ async function build_client({
 			}
 		},
 		resolve: {
+			...user_config.resolve,
 			alias: {
+				...(user_config.resolve && user_config.resolve.alias),
 				$app: path.resolve(`${build_dir}/runtime/app`),
 				$lib: config.kit.files.lib
 			}
 		},
 		plugins: [
+			...(user_config.plugins || []),
 			svelte({
 				extensions: config.extensions
 			})
@@ -370,10 +378,15 @@ async function build_server(
 			.trim()
 	);
 
+	/** @type {any} */
+	const user_config = config.kit.vite();
+
 	await vite.build({
+		...user_config,
 		root: cwd,
 		base,
 		build: {
+			...user_config.build,
 			ssr: true,
 			lib: {
 				entry: app_file,
@@ -384,12 +397,15 @@ async function build_server(
 			target: 'es2018'
 		},
 		resolve: {
+			...user_config.resolve,
 			alias: {
+				...(user_config.resolve && user_config.resolve.alias),
 				$app: path.resolve(`${build_dir}/runtime/app`),
 				$lib: config.kit.files.lib
 			}
 		},
 		plugins: [
+			...(user_config.plugins || []),
 			svelte({
 				extensions: config.extensions
 			})
@@ -457,16 +473,22 @@ async function build_service_worker(
 			.trim()
 	);
 
+	/** @type {any} */
+	const user_config = config.kit.vite();
+
 	await vite.build({
+		...user_config,
 		root: cwd,
 		base,
 		build: {
+			...user_config.build,
 			lib: {
 				entry: service_worker_entry_file,
 				name: 'app',
 				formats: ['es']
 			},
 			rollupOptions: {
+				...(user_config.build && user_config.build.rollupOptions),
 				output: {
 					entryFileNames: 'service-worker.js'
 				}
@@ -475,7 +497,9 @@ async function build_service_worker(
 			emptyOutDir: false
 		},
 		resolve: {
+			...user_config.resolve,
 			alias: {
+				...(user_config.resolve && user_config.resolve.alias),
 				'$service-worker': path.resolve(`${build_dir}/runtime/service-worker`)
 			}
 		},

packages/kit/src/core/dev/index.js

@@ -73,24 +73,33 @@ class Watcher extends EventEmitter {
 	}
 
 	async init_server() {
+		/** @type {any} */
+		const user_config = (this.config.kit.vite && this.config.kit.vite()) || {};
+
 		/**
 		 * @type {vite.ViteDevServer}
 		 */
 		this.viteDevServer = await vite.createServer({
+			...user_config,
+			configFile: false,
 			root: this.cwd,
 			resolve: {
+				...user_config.resolve,
 				alias: {
+					...(user_config.resolve && user_config.resolve.alias),
 					$app: path.resolve(`${this.dir}/runtime/app`),
 					$lib: this.config.kit.files.lib
 				}
 			},
 			plugins: [
+				...(user_config.plugins || []),
 				svelte({
 					extensions: this.config.extensions
 				})
 			],
 			publicDir: this.config.kit.files.assets,
 			server: {
+				...user_config.server,
 				middlewareMode: true
 			}
 		});

packages/kit/src/core/load_config/index.spec.js

@@ -5,6 +5,8 @@ import { validate_config } from './index.js';
 test('fills in defaults', () => {
 	const validated = validate_config({});
 
+	delete validated.kit.vite;
+
 	assert.equal(validated, {
 		compilerOptions: null,
 		extensions: ['.svelte'],
@@ -77,6 +79,10 @@ test('fills in partial blanks', () => {
 		}
 	});
 
+	assert.equal(validated.kit.vite(), {});
+
+	delete validated.kit.vite;
+
 	assert.equal(validated, {
 		compilerOptions: null,
 		extensions: ['.svelte'],

packages/kit/src/core/load_config/options.js

@@ -107,7 +107,26 @@ const options = {
 				}
 			},
 
-			target: expect_string(null)
+			target: expect_string(null),
+
+			vite: {
+				type: 'leaf',
+				default: () => ({}),
+				validate: (option, keypath) => {
+					if (typeof option === 'object') {
+						const config = option;
+						option = () => config;
+					}
+
+					if (typeof option !== 'function') {
+						throw new Error(
+							`${keypath} must be a Vite config object (https://vitejs.dev/config) or a function that returns one`
+						);
+					}
+
+					return option;
+				}
+			}
 		}
 	},
 

packages/kit/src/core/load_config/test/index.js

@@ -14,6 +14,8 @@ suite('load default config', async () => {
 
 	const config = await load_config({ cwd });
 
+	delete config.kit.vite; // can't test equality of a function
+
 	assert.equal(config, {
 		compilerOptions: null,
 		extensions: ['.svelte'],

packages/kit/test/apps/basics/svelte.config.cjs

@@ -1,8 +1,12 @@
 module.exports = {
 	kit: {
-		// TODO adapterless builds
 		adapter: '@sveltejs/adapter-node',
-
-		hostHeader: 'x-forwarded-host'
+		hostHeader: 'x-forwarded-host',
+		vite: {
+			build: {
+				minify: false
+			},
+			clearScreen: false
+		}
 	}
 };