feat(webpack): allow custom 'projectName' on Xcode project name from config (#10550)

packages/core/config/config.interface.ts

@@ -196,6 +196,12 @@ export interface NativeScriptConfig {
 	shared?: boolean;
 	previewAppSchema?: string;
 	overridePods?: string;
+	/**
+	 * Custom platform project name.
+	 * By default, the platforms/{platform}/{name} is based on the basename of the project directory.
+	 * You can override that to use a name of your choice by setting this.
+	 */
+	projectName?: string;
 	/**
 	 * Custom webpack config path
 	 * The default is `webpack.config.js` in the root however you can use a custom name and place elsewhere.

packages/webpack5/__tests__/helpers/platform.spec.ts

@@ -1,5 +1,9 @@
 import { env } from '../../src/';
-import { addPlatform, getEntryPath } from '../../src/helpers/platform';
+import {
+	addPlatform,
+	getEntryPath,
+	getDistPath,
+} from '../../src/helpers/platform';
 
 import { getValue } from '../../src/helpers/config';
 
@@ -47,3 +51,34 @@ describe('getEntryPath', () => {
 		expect(res).toEqual('__jest__/src/app.js');
 	});
 });
+
+describe('getDistPath', () => {
+	it('is generated from working directory when no projectName setting in nativescript.config.ts', () => {
+		env.ios = true;
+
+		const distPath = getDistPath();
+
+		expect(distPath).toEqual('platforms/ios/jest/app');
+		env.ios = false;
+	});
+
+	it('is generated using projectName value from nativescript.config.ts when set', () => {
+		env.ios = true;
+
+		// mock getValue
+		const getValueMock = getValue as jest.Mock;
+		const getValueMockImpl = getValueMock.getMockImplementation();
+
+		getValueMock.mockImplementation((key) => {
+			if (key === 'projectName') {
+				return 'projectNameSpecified';
+			}
+		});
+
+		const distPath = getDistPath();
+
+		expect(distPath).toEqual('platforms/ios/projectNameSpecified/app');
+
+		getValueMock.mockImplementation(getValueMockImpl);
+	});
+});

packages/webpack5/src/platforms/ios.ts

@@ -3,6 +3,7 @@ import { basename } from "path";
 import { INativeScriptPlatform } from "../helpers/platform";
 import { getProjectRootPath } from "../helpers/project";
 import { env } from '../';
+import { getValue } from '../helpers/config';
 
 function sanitizeName(appName: string): string {
 	return appName.split("").filter((c) =>
@@ -10,7 +11,9 @@ function sanitizeName(appName: string): string {
 	).join("");
 }
 function getDistPath() {
-	const appName = sanitizeName(basename(getProjectRootPath()));
+	// try projectName from nativescript.config.ts, if not set, use original method
+	const appName = getValue('projectName') ?? sanitizeName(basename(getProjectRootPath()));
+
 	return `${env.buildPath ?? "platforms"}/ios/${appName}/app`;
 }