fix: set navmesh preload as a plugin to avoid imposing @recast-navigation and @babylonjs/addons packages to be installed

Author: Julien Moreau-Mathis

editor/src/tools/workers/script.ts

@@ -40,7 +40,7 @@ async function compile(srcAbsolutePath: string, outputAbsolutePath: string) {
 			".ts": "ts",
 			".node": "file",
 		},
-		external: ["sharp", "electron"],
+		external: ["sharp", "electron", "@recast-navigation/core", "@recast-navigation/generators", "@babylonjs/addons"],
 		keepNames: true,
 		plugins: [replaceImportMetaDirname],
 	};

tools/esbuild.mjs

@@ -4,64 +4,58 @@ import { argv, exit } from "node:process";
 import { readFile } from "node:fs/promises";
 
 const replaceBabylonJsImports = {
-    name: "replaceImportMetaDirname",
-    setup(build) {
-        build.onLoad({ filter: /.*/ }, async (args) => {
-            const source = await readFile(args.path, "utf8");
+	name: "replaceImportMetaDirname",
+	setup(build) {
+		build.onLoad({ filter: /.*/ }, async (args) => {
+			const source = await readFile(args.path, "utf8");
 
-            const transformedSource = source
-                .replace(/"@babylonjs\/core\/.*"/g, "\"babylonjs\"")
-                .replace(/"@babylonjs\/gui\/.*"/g, "\"babylonjs-gui\"");
+			const transformedSource = source
+				.replace(/"@babylonjs\/core\/.*"/g, '"babylonjs"')
+				.replace(/"@babylonjs\/gui\/.*"/g, '"babylonjs-gui"')
+				.replace(/"@babylonjs\/addons\/.*"/g, '"babylonjs-addons"');
 
-            return {
-                loader: "default",
-                contents: transformedSource,
-            };
-        });
-    },
+			return {
+				loader: "default",
+				contents: transformedSource,
+			};
+		});
+	},
 };
 
 const args = argv.slice(2);
 const isWatch = args.includes("--watch");
 
 const mainBuildOptions = {
-    entryPoints: [
-        "./src/index.ts",
-    ],
-    bundle: true,
-    platform: "node",
-    target: "node20", // target version of Node.js
-    format: "cjs", // output format as CommonJS
-    outfile: "./build/index.node.js",
-    treeShaking: false,
-    loader: {
-        ".ts": "ts",
-    },
-    external: [
-        "babylonjs",
-        "babylonjs-gui",
-    ],
-    keepNames: true,
-    minify: !isWatch,
-    plugins: [
-        replaceBabylonJsImports
-    ],
+	entryPoints: ["./src/index.ts"],
+	bundle: true,
+	platform: "node",
+	target: "node20", // target version of Node.js
+	format: "cjs", // output format as CommonJS
+	outfile: "./build/index.node.js",
+	treeShaking: false,
+	loader: {
+		".ts": "ts",
+	},
+	external: ["babylonjs", "babylonjs-gui"],
+	keepNames: true,
+	minify: !isWatch,
+	plugins: [replaceBabylonJsImports],
 };
 
 if (args.includes("--watch")) {
-    esbuild
-        .context(mainBuildOptions)
-        .then(async (buildcontext) => {
-            await buildcontext.watch();
-            console.log("Watching...");
-        })
-        .catch((error) => {
-            console.error(error);
-            exit(1);
-        });
+	esbuild
+		.context(mainBuildOptions)
+		.then(async (buildcontext) => {
+			await buildcontext.watch();
+			console.log("Watching...");
+		})
+		.catch((error) => {
+			console.error(error);
+			exit(1);
+		});
 } else {
-    esbuild.build(mainBuildOptions).catch((error) => {
-        console.error(error);
-        exit(1);
-    });
+	esbuild.build(mainBuildOptions).catch((error) => {
+		console.error(error);
+		exit(1);
+	});
 }

tools/package.json

@@ -16,6 +16,10 @@
 			"types": "./declaration/src/index.d.ts",
 			"import": "./build/src/index.js",
 			"require": "./build/index.node.js"
+		},
+		"./*": {
+			"types": "./declaration/src/*.d.ts",
+			"import": "./build/src/*.js"
 		}
 	},
 	"typings": "declaration/src/index.d.ts",

tools/src/loading/script/preload.ts

@@ -5,13 +5,39 @@ import { AdvancedAssetContainer } from "../container";
 
 import { preloadSceneScriptAsset } from "./preload/scene";
 import { preloadCommonScriptAsset } from "./preload/common";
-import { preloadNavMeshScriptAsset } from "./preload/navmesh";
 
 /**
- * Defines the cache of all
+ * Defines the cache of all preloaded assets for scripts.
+ * Used to populate decorated properties in scripts using @visibleAsAsset.
  */
 export const scriptAssetsCache = new Map<string, any>();
 
+/**
+ * Defines the map of all parsers available to parse script assets.
+ * Some assets may not be needed by the game directly such as navmeshes which require @recast-navigation packages to be included.
+ * This map allows to register parsers only when needed to profit from tree shaking.
+ */
+export const scriptAssetsParsers = new Map<string, (parameters: IScriptAssetParserParameters) => Promise<unknown>>();
+
+export interface IScriptAssetParserParameters {
+	key: string;
+	rootUrl: string;
+	scene: Scene;
+}
+
+/**
+ *
+ * @param extension defines the extension supported by the parser. ie: "navmesh"
+ * @param parser defines the parser function to parse the asset.
+ */
+export function registerScriptAssetParser(extension: string, parser: (parameters: IScriptAssetParserParameters) => Promise<unknown>) {
+	if (scriptAssetsParsers.has(extension)) {
+		console.warn(`A parser for the extension '${extension}' was already registered. It will be overwritten.`);
+	}
+
+	scriptAssetsParsers.set(extension, parser);
+}
+
 /**
  * @internal
  */
@@ -56,12 +82,14 @@ export async function _preloadScriptsAssets(rootUrl: string, scene: Scene, scrip
 							scriptAssetsCache.set(key, new AdvancedAssetContainer(await preloadSceneScriptAsset(key, rootUrl, scene), rootUrl, scriptsMap));
 							break;
 
-						case "navmesh":
-							scriptAssetsCache.set(key, await preloadNavMeshScriptAsset(key, rootUrl));
-							break;
-
 						default:
-							scriptAssetsCache.set(key, await preloadCommonScriptAsset(key, rootUrl));
+							if (scriptAssetsParsers.has(extension!)) {
+								const parser = scriptAssetsParsers.get(extension!)!;
+								scriptAssetsCache.set(key, await parser({ key, rootUrl, scene }));
+								break;
+							} else {
+								scriptAssetsCache.set(key, await preloadCommonScriptAsset(key, rootUrl));
+							}
 							break;
 					}
 				} catch (e) {

…ls/src/loading/script/preload/navmesh.ts …oading/script/preload/plugins/navmesh.tstools/src/loading/script/preload/navmesh.ts renamed to tools/src/loading/script/preload/plugins/navmesh.ts tools/src/loading/script/preload/navmesh.ts renamed to tools/src/loading/script/preload/plugins/navmesh.ts

@@ -2,11 +2,13 @@ import { Vector3 } from "@babylonjs/core/Maths/math.vector";
 
 import { CreateNavigationPluginAsync } from "@babylonjs/addons";
 
-export async function preloadNavMeshScriptAsset(key: string, rootUrl: string) {
+import { IScriptAssetParserParameters } from "../../preload";
+
+export async function preloadNavMeshScriptAsset(parameters: IScriptAssetParserParameters) {
 	const [configResponse, navmeshResponse, tilesResponse] = await Promise.all([
-		fetch(`${rootUrl}${key}/config.json`),
-		fetch(`${rootUrl}${key}/navmesh.bin`),
-		fetch(`${rootUrl}${key}/tilecache.bin`),
+		fetch(`${parameters.rootUrl}${parameters.key}/config.json`),
+		fetch(`${parameters.rootUrl}${parameters.key}/navmesh.bin`),
+		fetch(`${parameters.rootUrl}${parameters.key}/tilecache.bin`),
 	]);
 	const [config, navmeshData, tilesData] = await Promise.all([configResponse.json(), navmeshResponse.arrayBuffer(), tilesResponse.arrayBuffer()]);