respect --mode (#5602)

* failing test for #5573

* remove some logging

* add app.d.ts

* use define to control dev/prod env values

* tidy up

* jeez

* come on

* changeset

* remove redundant env (#5614)

* remove redundant env

* changeset

* add meatier description

* huh, cant use those in comments, they get replaced dangerously

.changeset/modern-lies-deny.md

@@ -0,0 +1,5 @@
+---
+'@sveltejs/kit': patch
+---
+
+Respect custom Vite mode in SSR build

.changeset/thick-chicken-applaud.md

@@ -0,0 +1,5 @@
+---
+'@sveltejs/kit': patch
+---
+
+[breaking] remove mode, prod and server from \$app/env

packages/kit/src/runtime/app/env.js

@@ -3,24 +3,9 @@
  */
 export const browser = !import.meta.env.SSR;
 
-/**
- * @type {import('$app/env').server}
- */
-export const server = !!import.meta.env.SSR;
-
 /**
  * @type {import('$app/env').dev}
  */
-export const dev = !!import.meta.env.DEV;
-
-/**
- * @type {import('$app/env').prod}
- */
-export const prod = !import.meta.env.DEV;
-
-/**
- * @type {import('$app/env').mode}
- */
-export const mode = import.meta.env.MODE;
+export const dev = __SVELTEKIT_DEV__;
 
 export { prerendering } from '../env.js';

packages/kit/src/vite/build/build_server.js

@@ -111,9 +111,9 @@ export class Server {
 /**
  * @param {{
  *   cwd: string;
- *   config: import('types').ValidatedConfig
- *   vite_config_env: import('vite').ConfigEnv
- *   manifest_data: import('types').ManifestData
+ *   config: import('types').ValidatedConfig;
+ *   vite_config_env: import('vite').ConfigEnv;
+ *   manifest_data: import('types').ManifestData;
  *   build_dir: string;
  *   output_dir: string;
  *   service_worker_entry_file: string | null;

packages/kit/src/vite/build/utils.js

@@ -114,7 +114,8 @@ export const get_default_config = function ({ config, input, ssr, outDir }) {
 			__SVELTEKIT_ADAPTER_NAME__: JSON.stringify(config.kit.adapter?.name),
 			__SVELTEKIT_APP_VERSION__: JSON.stringify(config.kit.version.name),
 			__SVELTEKIT_APP_VERSION_FILE__: JSON.stringify(`${config.kit.appDir}/version.json`),
-			__SVELTEKIT_APP_VERSION_POLL_INTERVAL__: JSON.stringify(config.kit.version.pollInterval)
+			__SVELTEKIT_APP_VERSION_POLL_INTERVAL__: JSON.stringify(config.kit.version.pollInterval),
+			__SVELTEKIT_DEV__: 'false'
 		},
 		// prevent Vite copying the contents of `config.kit.files.assets`,
 		// if it happens to be 'public' instead of 'static'

packages/kit/src/vite/index.js

@@ -206,6 +206,7 @@ function kit() {
 					}
 				},
 				define: {
+					__SVELTEKIT_DEV__: 'true',
 					__SVELTEKIT_APP_VERSION_POLL_INTERVAL__: '0'
 				},
 				resolve: {

packages/kit/src/vite/utils.js

@@ -12,7 +12,7 @@ export async function get_vite_config(config_env) {
 	if (!config) {
 		throw new Error('Could not load Vite config');
 	}
-	return config;
+	return { ...config, mode: config_env.mode };
 }
 
 /**

packages/kit/test/apps/options/package.json

@@ -4,7 +4,7 @@
 	"version": "0.0.1",
 	"scripts": {
 		"dev": "vite dev",
-		"build": "vite build",
+		"build": "vite build --mode custom",
 		"preview": "vite preview",
 		"prepare": "node ../../cli.js sync",
 		"check": "tsc && svelte-check",

packages/kit/test/apps/options/source/app.d.ts

@@ -0,0 +1,11 @@
+/// <reference types="@sveltejs/kit" />
+
+declare namespace App {
+	interface Locals {}
+
+	interface Platform {}
+
+	interface Session {}
+
+	interface Stuff {}
+}

packages/kit/test/apps/options/source/pages/mode/index.js

@@ -0,0 +1,7 @@
+export function GET() {
+	return {
+		body: {
+			mode_from_endpoint: import.meta.env.MODE
+		}
+	};
+}

packages/kit/test/apps/options/source/pages/mode/index.svelte

@@ -0,0 +1,10 @@
+<script>
+	import { dev } from '$app/env';
+
+	/** @type {string} */
+	export let mode_from_endpoint;
+</script>
+
+<h2>
+	{mode_from_endpoint} === {import.meta.env.MODE} === {dev ? 'development' : 'custom'}
+</h2>

packages/kit/test/apps/options/test/test.js

@@ -203,3 +203,12 @@ test.describe('serviceWorker', () => {
 		expect(await page.content()).not.toMatch('navigator.serviceWorker');
 	});
 });
+
+test.describe('Vite options', () => {
+	test('Respects --mode', async ({ page }) => {
+		await page.goto('/path-base/mode');
+
+		const mode = process.env.DEV ? 'development' : 'custom';
+		expect(await page.textContent('h2')).toBe(`${mode} === ${mode} === ${mode}`);
+	});
+});

packages/kit/test/apps/options/tsconfig.json

@@ -4,6 +4,7 @@
 		"checkJs": true,
 		"noEmit": true,
 		"paths": {
+			"@sveltejs/kit": ["../../../types"],
 			"$lib": ["source/components"],
 			"$lib/*": ["source/components/*"],
 			"types": ["../../../types/internal"]

packages/kit/types/ambient.d.ts

@@ -65,7 +65,7 @@ declare namespace App {
 
 /**
  * ```ts
- * import { browser, dev, mode, prerendering, prod, server } from '$app/env';
+ * import { browser, dev, prerendering } from '$app/env';
  * ```
  */
 declare module '$app/env' {
@@ -75,31 +75,14 @@ declare module '$app/env' {
 	export const browser: boolean;
 
 	/**
-	 * `true` in development mode, `false` in production.
+	 * Whether the dev server is running. This is not guaranteed to correspond to `NODE_ENV` or `MODE`.
 	 */
 	export const dev: boolean;
 
-	/**
-	 * The Vite.js mode the app is running in. Configure in [`vite.config.js`](https://vitejs.dev/config/shared-options.html#mode).
-	 * Vite.js loads the dotenv file associated with the provided mode, `.env.[mode]` or `.env.[mode].local`.
-	 * By default, `vite dev` runs with `mode=development` and `vite build` runs with `mode=production`.
-	 */
-	export const mode: string;
-
 	/**
 	 * `true` when prerendering, `false` otherwise.
 	 */
 	export const prerendering: boolean;
-
-	/**
-	 * `true` in production mode, `false` in development.
-	 */
-	export const prod: boolean;
-
-	/**
-	 * `true` if the app is running on the server.
-	 */
-	export const server: boolean;
 }
 
 /**

packages/kit/types/internal.d.ts

@@ -323,4 +323,5 @@ declare global {
 	const __SVELTEKIT_APP_VERSION__: string;
 	const __SVELTEKIT_APP_VERSION_FILE__: string;
 	const __SVELTEKIT_APP_VERSION_POLL_INTERVAL__: number;
+	const __SVELTEKIT_DEV__: boolean;
 }