{"record":{"id":"f85cd3657507feeb","repo":"OrchardCMS/OrchardCore","slug":"invalid-async-component-load-result-vue-runtime","errorCode":null,"errorMessage":"Invalid async component load result: ","messagePattern":"Invalid async component load result: ","errorType":"exception","errorClass":"Error","httpStatus":null,"severity":"error","filePath":"src/OrchardCore.Modules/OrchardCore.Resources/wwwroot/Vendor/vue-2.7.16/vue.runtime.js","lineNumber":3235,"sourceCode":"                      else {\n                          throw err;\n                      }\n                  })\n                      .then(function (comp) {\n                      if (thisRequest !== pendingRequest && pendingRequest) {\n                          return pendingRequest;\n                      }\n                      if (!comp) {\n                          warn(\"Async component loader resolved to undefined. \" +\n                              \"If you are using retry(), make sure to return its return value.\");\n                      }\n                      // interop module default\n                      if (comp &&\n                          (comp.__esModule || comp[Symbol.toStringTag] === 'Module')) {\n                          comp = comp.default;\n                      }\n                      if (comp && !isObject(comp) && !isFunction(comp)) {\n                          throw new Error(\"Invalid async component load result: \".concat(comp));\n                      }\n                      return comp;\n                  })));\n      };\n      return function () {\n          var component = load();\n          return {\n              component: component,\n              delay: delay,\n              timeout: timeout,\n              error: errorComponent,\n              loading: loadingComponent\n          };\n      };\n  }\n\n  function createLifeCycle(hookName) {\n      return function (fn, target) {","sourceCodeStart":3217,"sourceCodeEnd":3253,"githubUrl":"https://github.com/OrchardCMS/OrchardCore/blob/4306c0717fe573f6fca1b4955909ddab6a192807/src/OrchardCore.Modules/OrchardCore.Resources/wwwroot/Vendor/vue-2.7.16/vue.runtime.js#L3217-L3253","documentation":"Same dev-mode validation as error 430 but in the UMD/dev build vue.runtime.js: after async component resolution and ES-module default interop, Vue requires the result to be an object or function and throws otherwise. It signals that a lazily loaded component factory resolved to something that is not a Vue component definition.","triggerScenarios":"Async component definitions such as Vue.component('x', () => loadX()) or router route.component: () => import(...) whose promise resolves to a string, undefined, null, number, or a module object without a usable default/component export.","commonSituations":"Dynamic import of a file that only exports named helpers; CommonJS interop where module.exports was overwritten with a non-component value; a bundler returning an empty namespace object consumed as-is when the actual component is on m.default; renamed/moved files leaving the loader pointing at a stub.","solutions":["Add/restore `export default` of the component options object in the lazily imported file.","Map named exports explicitly: () => import('./x').then(m => m.default || m.X).","Log or breakpoint inside the factory to inspect the resolved module shape and correct the access path.","Fix the import path so it targets the actual component module.","Confirm the dev build's stricter dev-only assertion is the surface: the same code may appear to 'work' silently in prod, so fix the module shape rather than suppressing the error."],"exampleFix":"// before\nconst AsyncList = () => import('./list-module'); // module has no default export\n// after\nconst AsyncList = () => import('./list-module').then(m => m.List);\n// or add `export default List` in list-module.js","handlingStrategy":"type-guard","validationCode":"import('./list-module').then(m => { const c = m.default || m.List; if (!c || (typeof c !== 'object' && typeof c !== 'function')) throw new TypeError('loader must resolve to object/function, got ' + typeof c); return c; })","typeGuard":"function isValidAsyncComp(v) { return v != null && (typeof v === 'object' || typeof v === 'function'); }","tryCatchPattern":"try { const m = await loader(); if (!isValidAsyncComp(m.default || m)) throw new Error('Invalid async component module shape'); return m.default || m; } catch (e) { console.error('Lazy component failed:', e); return FallbackComponent; }","preventionTips":["Add `export default` to every lazily loaded component module","Use .then(m => m.default || m.X) instead of returning the raw namespace","Fix CommonJS interop: don't overwrite module.exports with a non-component value","Verify the bundled module shape after build-tool changes (webpack/Vite/TS)","Write a unit test that resolves every lazy route and asserts a valid component"],"tags":["vue","async-component","dynamic-import","umd"],"backgroundTag":"unexpected-response-shape","analyzedSha":"4306c0717fe573f6fca1b4955909ddab6a192807","analyzedAt":"2026-09-13T17:41:05.024Z","contentChangedAt":"2026-09-13T17:41:05.024Z","schemaVersion":2},"datasetVersion":"2026-09-16T04:17:20.429Z"}