[feat] use config.kit.paths.base for static assets (#4448)

fixes #4442, fixes #2843, fixes #3726

Write static files to a folder that takes into account the base path value

.changeset/smooth-waves-accept.md

@@ -0,0 +1,10 @@
+---
+'@sveltejs/adapter-cloudflare': patch
+'@sveltejs/adapter-cloudflare-workers': patch
+'@sveltejs/adapter-netlify': patch
+'@sveltejs/adapter-node': patch
+'@sveltejs/adapter-vercel': patch
+'@sveltejs/kit': patch
+---
+
+Use config.kit.paths.base prefix for static assets

packages/adapter-cloudflare-workers/files/entry.js

@@ -6,7 +6,7 @@ const static_asset_manifest = JSON.parse(static_asset_manifest_json);
 
 const server = new Server(manifest);
 
-const prefix = `/${manifest.appDir}/`;
+const app_path = `/${manifest.appPath}/`;
 
 export default {
 	/**
@@ -20,12 +20,12 @@ export default {
 		const url = new URL(req.url);
 
 		// static assets
-		if (url.pathname.startsWith(prefix)) {
+		if (url.pathname.startsWith(app_path)) {
 			/** @type {Response} */
 			const res = await get_asset_from_kv(req, env, context);
 			if (is_error(res.status)) return res;
 
-			const cache_control = url.pathname.startsWith(prefix + 'immutable/')
+			const cache_control = url.pathname.startsWith(app_path + 'immutable/')
 				? 'public, immutable, max-age=31536000'
 				: 'no-cache';
 

packages/adapter-cloudflare-workers/index.js

@@ -73,8 +73,9 @@ export default function ({ config = 'wrangler.toml' } = {}) {
 			});
 
 			builder.log.minor('Copying assets...');
-			builder.writeClient(site.bucket);
-			builder.writePrerendered(site.bucket);
+			const bucket_dir = `${site.bucket}${builder.config.kit.paths.base}`;
+			builder.writeClient(bucket_dir);
+			builder.writePrerendered(bucket_dir);
 		}
 	};
 }

packages/adapter-cloudflare/index.js

@@ -23,8 +23,9 @@ export default function () {
 			builder.rimraf(tmp);
 			builder.mkdirp(tmp);
 
-			const written_files = builder.writeClient(dest);
-			builder.writePrerendered(dest);
+			const dest_dir = `${dest}${builder.config.kit.paths.base}`;
+			const written_files = builder.writeClient(dest_dir);
+			builder.writePrerendered(dest_dir);
 
 			const relativePath = posix.relative(tmp, builder.getServerDirectory());
 

packages/adapter-cloudflare/src/worker.js

@@ -4,7 +4,7 @@ import * as Cache from 'worktop/cfw.cache';
 
 const server = new Server(manifest);
 
-const prefix = `/${manifest.appDir}/`;
+const app_path = `/${manifest.appPath}/`;
 
 /** @type {import('worktop/cfw').Module.Worker<{ ASSETS: import('worktop/cfw.durable').Durable.Object }>} */
 const worker = {
@@ -18,11 +18,11 @@ const worker = {
 		let { pathname } = new URL(req.url);
 
 		// static assets
-		if (pathname.startsWith(prefix)) {
+		if (pathname.startsWith(app_path)) {
 			res = await env.ASSETS.fetch(req);
 			if (!res.ok) return res;
 
-			const cache_control = pathname.startsWith(prefix + 'immutable/')
+			const cache_control = pathname.startsWith(app_path + 'immutable/')
 				? 'public, immutable, max-age=31536000'
 				: 'no-cache';
 

packages/adapter-netlify/index.js

@@ -55,15 +55,16 @@ export default function ({ split = false, edge = edge_set_in_env_var } = {}) {
 			builder.log.minor(`Publishing to "${publish}"`);
 
 			builder.log.minor('Copying assets...');
-			builder.writeClient(publish);
-			builder.writePrerendered(publish);
+			const publish_dir = `${publish}${builder.config.kit.paths.base}`;
+			builder.writeClient(publish_dir);
+			builder.writePrerendered(publish_dir);
 
 			builder.log.minor('Writing custom headers...');
 			const headers_file = join(publish, '_headers');
 			builder.copy('_headers', headers_file);
 			appendFileSync(
 				headers_file,
-				`\n\n/${builder.config.kit.appDir}/immutable/*\n  cache-control: public\n  cache-control: immutable\n  cache-control: max-age=31536000\n`
+				`\n\n/${builder.getAppPath()}/immutable/*\n  cache-control: public\n  cache-control: immutable\n  cache-control: max-age=31536000\n`
 			);
 
 			if (edge) {

packages/adapter-netlify/src/edge.js

@@ -2,7 +2,7 @@ import { Server } from '0SERVER';
 import { manifest, prerendered } from 'MANIFEST';
 
 const server = new Server(manifest);
-const prefix = `/${manifest.appDir}/`;
+const prefix = `/${manifest.appPath}/`;
 
 const initialized = server.init({
 	// @ts-ignore

packages/adapter-node/index.js

@@ -30,8 +30,8 @@ export default function (opts = {}) {
 			builder.mkdirp(tmp);
 
 			builder.log.minor('Copying assets');
-			builder.writeClient(`${out}/client`);
-			builder.writePrerendered(`${out}/prerendered`);
+			builder.writeClient(`${out}/client${builder.config.kit.paths.base}`);
+			builder.writePrerendered(`${out}/prerendered${builder.config.kit.paths.base}`);
 
 			if (precompress) {
 				builder.log.minor('Compressing assets');

packages/adapter-node/src/handler.js

@@ -36,7 +36,7 @@ function serve(path, client = false) {
 				client &&
 				((res, pathname) => {
 					// only apply to build directory, not e.g. version.json
-					if (pathname.startsWith(`/${manifest.appDir}/immutable/`)) {
+					if (pathname.startsWith(`/${manifest.appPath}/immutable/`)) {
 						res.setHeader('cache-control', 'public,max-age=31536000,immutable');
 					}
 				})

packages/adapter-vercel/index.js

@@ -98,7 +98,7 @@ export default function ({ external = [], edge, split } = {}) {
 			const files = fileURLToPath(new URL('./files', import.meta.url).href);
 
 			const dirs = {
-				static: `${dir}/static`,
+				static: `${dir}/static${builder.config.kit.paths.base}`,
 				functions: `${dir}/functions`
 			};
 
@@ -118,7 +118,7 @@ export default function ({ external = [], edge, split } = {}) {
 				...redirects[builder.config.kit.trailingSlash],
 				...prerendered_redirects,
 				{
-					src: `/${builder.config.kit.appDir}/.+`,
+					src: `/${builder.getAppPath()}/.+`,
 					headers: {
 						'cache-control': 'public, immutable, max-age=31536000'
 					}

packages/kit/src/core/adapt/builder.js

@@ -132,6 +132,10 @@ export function create_builder({ config, build_data, routes, prerendered, log })
 			return config.kit.files.assets;
 		},
 
+		getAppPath() {
+			return build_data.app_path;
+		},
+
 		writeClient(dest) {
 			return [...copy(`${config.kit.outDir}/output/client`, dest)];
 		},

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

@@ -45,6 +45,7 @@ export function generate_manifest({ build_data, relative_path, routes, format =
 	/** @type {import('types').SSRManifest} */
 	return `{
 		appDir: ${s(build_data.app_dir)},
+		appPath: ${s(build_data.app_path)},
 		assets: new Set(${s(assets)}),
 		mimeTypes: ${s(get_mime_lookup(build_data.manifest_data))},
 		_: {

packages/kit/src/exports/vite/dev/index.js

@@ -59,6 +59,7 @@ export async function dev(vite, vite_config, svelte_config) {
 
 		manifest = {
 			appDir: svelte_config.kit.appDir,
+			appPath: svelte_config.kit.appDir,
 			assets: new Set(manifest_data.assets.map((asset) => asset.file)),
 			mimeTypes: get_mime_lookup(manifest_data),
 			_: {

packages/kit/src/exports/vite/index.js

@@ -379,6 +379,7 @@ function kit() {
 				);
 
 				log.info('Building server');
+
 				const options = {
 					cwd,
 					config: svelte_config,
@@ -395,6 +396,9 @@ function kit() {
 				/** @type {import('types').BuildData} */
 				build_data = {
 					app_dir: svelte_config.kit.appDir,
+					app_path: `${svelte_config.kit.paths.base.slice(1)}${
+						svelte_config.kit.paths.base ? '/' : ''
+					}${svelte_config.kit.appDir}`,
 					manifest_data,
 					service_worker: options.service_worker_entry_file ? 'service-worker.js' : null, // TODO make file configurable?
 					client,

packages/kit/types/index.d.ts

@@ -85,6 +85,8 @@ export interface Builder {
 	getClientDirectory(): string;
 	getServerDirectory(): string;
 	getStaticDirectory(): string;
+	/** The application path including any configured base path */
+	getAppPath(): string;
 
 	/**
 	 * @param dest the destination folder to which files should be copied
@@ -380,6 +382,7 @@ export interface ServerInitOptions {
 
 export interface SSRManifest {
 	appDir: string;
+	appPath: string;
 	assets: Set<string>;
 	mimeTypes: Record<string, string>;
 

packages/kit/types/internal.d.ts

@@ -47,6 +47,7 @@ export interface Asset {
 
 export interface BuildData {
 	app_dir: string;
+	app_path: string;
 	manifest_data: ManifestData;
 	service_worker: string | null;
 	client: {