NativeScript/NativeScript · error · Error

Failed to load component from module: ${moduleName}

Error message

Failed to load component from module: ${moduleName}

What it means

Thrown by View.createViewFromEntry when the entry's moduleName resolves to an XML module but that module has no default export instantiable as a View (or the XML module could not be loaded). The builder needs the transpiled XML module to expose a default component class.

Source

Thrown at packages/core/ui/builder/index.ts:98

				const view = moduleExports.createPage();
				const resolvedCssModuleName = resolveModuleName(moduleName, 'css'); //entry.moduleName + ".css";
				if (resolvedCssModuleName) {
					view.addCssFile(resolvedCssModuleName);
				}

				return view;
			} else {
				let componentView;
				if (__UI_USE_XML_PARSER__) {
					const componentModule = loadInternal(moduleName, moduleExports);
					componentView = componentModule && componentModule.component;
				} else {
					const resolvedXmlModuleName = resolveModuleName(moduleName, 'xml');
					const componentModule = resolvedXmlModuleName ? global.loadModule(resolvedXmlModuleName) : null;
					if (componentModule?.default) {
						componentView = new componentModule.default();
					} else {
						throw new Error('Failed to load component from module: ' + moduleName);
					}
				}
				return componentView;
			}
		}

		throw new Error('Failed to load page XML file for module: ' + entry.moduleName);
	}

	static parse(value: string | Template, context?: any): View {
		if (typeof value === 'function') {
			return (<Template>value)();
		} else {
			const exports = context ? getExports(context) : undefined;
			const componentModule = parseInternal(value, exports);

			return componentModule && componentModule.component;
		}

View on GitHub (pinned to 6800aefa65)

Solutions

  1. Verify moduleName matches a page XML file (e.g. 'pages/main-page' for main-page.xml) that exists and compiles
  2. Check bundler XML loading configuration (nativescript-dev-webpack / vite plugin)
  3. Ensure the resolved XML module exposes a default export; otherwise export a component from code and use entry.create

Example fix

// before
frame.navigate({ moduleName: 'pages/main' });
// after
frame.navigate({ moduleName: 'pages/main-page' }); // main-page.xml exists
Defensive patterns

Strategy: try-catch

Validate before calling

// ensure pages/main-page.xml exists and exports a default component
import './pages/main-page.xml';

Try / catch

try { frame.navigate({ moduleName }); } catch (e) { if (String(e.message).startsWith('Failed to load component')) { frame.navigate({ create: () => new FallbackPage() }); } else throw e; }

Prevention

When it happens

Trigger: NavigationEntry.moduleName pointing to a module that exists but whose XML fails to compile into a default export; moduleName resolving to a JS/TS file instead of XML; corrupted build output.

Common situations: Renamed XML file with stale module name, bundler misconfiguration excluding XML transformation, moduleName pointing at a folder or a non-page module.

Related errors


AI-assisted analysis of NativeScript/NativeScript@6800aefa65 (2026-08-30). Data as JSON: /api/errors/b9d38c70df6195d2. Report an issue: GitHub.