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
- Verify moduleName matches a page XML file (e.g. 'pages/main-page' for main-page.xml) that exists and compiles
- Check bundler XML loading configuration (nativescript-dev-webpack / vite plugin)
- 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
- Use entry.create for code-defined pages to avoid XML resolution entirely
- Keep page module names in sync with file names
- Verify XML compiles in CI builds
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
- Failed to load page XML file for module: ${entry.moduleName}
- Code file with path "${codeFileAttribute}" cannot be found!
- Css file with path "${attributes[CSS_FILE]}" cannot be found
- Failed to create View with entry.create() function.
- Failed to load component from module: + moduleName
AI-assisted analysis of NativeScript/NativeScript@6800aefa65 (2026-08-30).
Data as JSON: /api/errors/b9d38c70df6195d2.
Report an issue: GitHub.