{"record":{"id":"b9d38c70df6195d2","repo":"NativeScript/NativeScript","slug":"failed-to-load-component-from-module-modulename","errorCode":null,"errorMessage":"Failed to load component from module: ${moduleName}","messagePattern":"Failed to load component from module: (.+?)","errorType":"exception","errorClass":"Error","httpStatus":null,"severity":"error","filePath":"packages/core/ui/builder/index.ts","lineNumber":98,"sourceCode":"\t\t\t\tconst view = moduleExports.createPage();\n\t\t\t\tconst resolvedCssModuleName = resolveModuleName(moduleName, 'css'); //entry.moduleName + \".css\";\n\t\t\t\tif (resolvedCssModuleName) {\n\t\t\t\t\tview.addCssFile(resolvedCssModuleName);\n\t\t\t\t}\n\n\t\t\t\treturn view;\n\t\t\t} else {\n\t\t\t\tlet componentView;\n\t\t\t\tif (__UI_USE_XML_PARSER__) {\n\t\t\t\t\tconst componentModule = loadInternal(moduleName, moduleExports);\n\t\t\t\t\tcomponentView = componentModule && componentModule.component;\n\t\t\t\t} else {\n\t\t\t\t\tconst resolvedXmlModuleName = resolveModuleName(moduleName, 'xml');\n\t\t\t\t\tconst componentModule = resolvedXmlModuleName ? global.loadModule(resolvedXmlModuleName) : null;\n\t\t\t\t\tif (componentModule?.default) {\n\t\t\t\t\t\tcomponentView = new componentModule.default();\n\t\t\t\t\t} else {\n\t\t\t\t\t\tthrow new Error('Failed to load component from module: ' + moduleName);\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\treturn componentView;\n\t\t\t}\n\t\t}\n\n\t\tthrow new Error('Failed to load page XML file for module: ' + entry.moduleName);\n\t}\n\n\tstatic parse(value: string | Template, context?: any): View {\n\t\tif (typeof value === 'function') {\n\t\t\treturn (<Template>value)();\n\t\t} else {\n\t\t\tconst exports = context ? getExports(context) : undefined;\n\t\t\tconst componentModule = parseInternal(value, exports);\n\n\t\t\treturn componentModule && componentModule.component;\n\t\t}","sourceCodeStart":80,"sourceCodeEnd":116,"githubUrl":"https://github.com/NativeScript/NativeScript/blob/6800aefa6511d23ddad8beb38ccc8541c5e91628/packages/core/ui/builder/index.ts#L80-L116","documentation":"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.","triggerScenarios":"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.","commonSituations":"Renamed XML file with stale module name, bundler misconfiguration excluding XML transformation, moduleName pointing at a folder or a non-page module.","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"],"exampleFix":"// before\nframe.navigate({ moduleName: 'pages/main' });\n// after\nframe.navigate({ moduleName: 'pages/main-page' }); // main-page.xml exists","handlingStrategy":"try-catch","validationCode":"// ensure pages/main-page.xml exists and exports a default component\nimport './pages/main-page.xml';","typeGuard":null,"tryCatchPattern":"try { frame.navigate({ moduleName }); } catch (e) { if (String(e.message).startsWith('Failed to load component')) { frame.navigate({ create: () => new FallbackPage() }); } else throw e; }","preventionTips":["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"],"tags":["navigation","xml","module-resolution"],"backgroundTag":"module-not-found","analyzedSha":"6800aefa6511d23ddad8beb38ccc8541c5e91628","analyzedAt":"2026-08-30T20:04:56.809Z","schemaVersion":2},"datasetVersion":"2026-08-30T23:17:21.991Z"}