fix(editor): Account for subpath when serving config.js (#17832)

Co-authored-by: autologie <[email protected]>

Author: ivov

packages/cli/src/commands/start.ts

@@ -147,7 +147,6 @@ export class Start extends BaseCommand<z.infer<typeof flagsSchema>> {
 					replaceStream('/{{BASE_PATH}}/', n8nPath, { ignoreCase: false }),
 					replaceStream('/%7B%7BBASE_PATH%7D%7D/', n8nPath, { ignoreCase: false }),
 					replaceStream('/%257B%257BBASE_PATH%257D%257D/', n8nPath, { ignoreCase: false }),
-					replaceStream('/static/', n8nPath + 'static/', { ignoreCase: false }),
 				];
 				if (filePath.endsWith('index.html')) {
 					streams.push(

packages/cli/src/server.ts

@@ -293,7 +293,6 @@ export class Server extends AbstractServer {
 					release: `n8n@${N8N_VERSION}`,
 				});
 				const frontendConfig = [
-					`window.BASE_PATH = '${this.globalConfig.path}';`,
 					`window.REST_ENDPOINT = '${this.globalConfig.endpoints.rest}';`,
 					`window.sentry = ${frontendSentryConfig};`,
 				].join('\n');

packages/frontend/editor-ui/index.html

@@ -5,9 +5,10 @@
 		<meta http-equiv="X-UA-Compatible" content="IE=edge" />
 		<meta name="viewport" content="width=device-width,initial-scale=1.0" />
 		<link rel="icon" href="/favicon.ico" />
-        <link rel="stylesheet" href="/static/prefers-color-scheme.css">
 		%CONFIG_SCRIPT%
-		<script src="/static/posthog.init.js" type="text/javascript"></script>
+		<link rel="stylesheet" href="/{{BASE_PATH}}/static/prefers-color-scheme.css">
+		<script src="/{{BASE_PATH}}/static/base-path.js" type="text/javascript"></script>
+		<script src="/{{BASE_PATH}}/static/posthog.init.js" type="text/javascript"></script>
 
 		<title>n8n.io - Workflow Automation</title>
 	</head>

packages/frontend/editor-ui/public/static/base-path.js

@@ -0,0 +1 @@
+window.BASE_PATH = '/{{BASE_PATH}}/';

packages/frontend/editor-ui/vite.config.mts

@@ -128,7 +128,7 @@ const plugins: UserConfig['plugins'] = [
 		transformIndexHtml: (html, ctx) => {
 			const replacement = ctx.server
 				? '' // Skip when using Vite dev server
-				: '<script src="/{{REST_ENDPOINT}}/config.js"></script>';
+				: '<script src="/{{BASE_PATH}}/{{REST_ENDPOINT}}/config.js"></script>';
 
 			return html.replace('%CONFIG_SCRIPT%', replacement);
 		},