{"record":{"id":"ff467b38bc1a3969","repo":"angular/angular-cli","slug":"webpackresourceloader-cannot-be-used-without-paren","errorCode":null,"errorMessage":"WebpackResourceLoader cannot be used without parentCompilation","messagePattern":"WebpackResourceLoader cannot be used without parentCompilation","errorType":"exception","errorClass":null,"httpStatus":null,"severity":"critical","filePath":"packages/ngtools/webpack/src/resource_loader.ts","lineNumber":114,"sourceCode":"\n  getAffectedResources(file: string): Iterable<string> {\n    return this._reverseDependencies.get(file) || [];\n  }\n\n  setAffectedResources(file: string, resources: Iterable<string>): void {\n    this._reverseDependencies.set(file, new Set(resources));\n  }\n\n  // eslint-disable-next-line max-lines-per-function\n  private async _compile(\n    filePath?: string,\n    data?: string,\n    fileExtension?: string,\n    resourceType?: 'style' | 'template',\n    containingFile?: string,\n  ): Promise<CompilationOutput> {\n    if (!this._parentCompilation) {\n      throw new Error('WebpackResourceLoader cannot be used without parentCompilation');\n    }\n\n    const { context, webpack } = this._parentCompilation.compiler;\n    const {\n      EntryPlugin,\n      NormalModule,\n      library,\n      node,\n      sources,\n      util: { createHash },\n    } = webpack;\n\n    const getEntry = (): string => {\n      if (filePath) {\n        return `${filePath}?${NG_COMPONENT_RESOURCE_QUERY}`;\n      } else if (resourceType) {\n        return (\n          // app.component.ts-2.css?ngResource!=!@ngtools/webpack/src/loaders/inline-resource.js!app.component.ts","sourceCodeStart":96,"sourceCodeEnd":132,"githubUrl":"https://github.com/angular/angular-cli/blob/bb72145f9ab45aee29f523236b3a25cd0813a841/packages/ngtools/webpack/src/resource_loader.ts#L96-L132","documentation":"WebpackResourceLoader compiles Angular component resources (templates/styles) through a child webpack compilation. It requires a parent webpack Compilation to be attached via `setParentCompilation()` before any resource compilation can run; without it there is no compiler context, webpack module machinery, or output filesystem to use, so the loader refuses to proceed.","triggerScenarios":"Calling `get()`, `getEntry()`/`entry`, or `compilationResult()` (which routes into `_compile`) on a WebpackResourceLoader instance whose `setParentCompilation(compilation)` was never called, or was called on a stale instance after the compilation completed.","commonSituations":"Custom AngularCompilerPlugin/lifecycle hook integration where the loader is instantiated manually; using the resource loader outside a webpack build (e.g. in a custom transform or test harness); calling `get()` in a plugin hook that runs before the compilation is attached.","solutions":["Call `loader.setParentCompilation(compilation)` with the active webpack Compilation before invoking get()/compilationResult()","Ensure the loader instance you are using is the one managed by AngularCompilerPlugin, which wires the parent compilation automatically","If running outside webpack, do not use WebpackResourceLoader; use an alternative resource compiler (e.g. Jest/resource loader equivalents)","Check plugin hook ordering so the loader is not invoked before the parent compilation hook fires"],"exampleFix":"// before\nconst loader = new WebpackResourceLoader();\nconst output = await loader.get('./app.component.html');\n// after\nconst loader = new WebpackResourceLoader();\nloader.setParentCompilation(compilation); // from the active webpack build\nconst output = await loader.get('./app.component.html');","handlingStrategy":"validation","validationCode":"if (!loader || typeof loader.setParentCompilation !== 'function') throw new Error('Invalid WebpackResourceLoader');\nloader.setParentCompilation(compilation); // must precede any get()/compilationResult() call","typeGuard":"function isResourceLoaderReady(loader, compilation) {\n  return !!loader && !!compilation && typeof loader.setParentCompilation === 'function';\n}","tryCatchPattern":"try {\n  loader.setParentCompilation(compilation);\n  output = await loader.get(filePath);\n} catch (e) {\n  if (e.message.includes('cannot be used without parentCompilation')) {\n    throw new Error('ResourceLoader used outside a webpack compilation lifecycle');\n  }\n  throw e;\n}","preventionTips":["Always attach the parent compilation immediately after constructing the loader","Only call resource loading inside webpack compilation hooks where a Compilation is available","Reuse the plugin-managed loader instance instead of creating your own"],"tags":["webpack","angular","initialization","plugin"],"backgroundTag":"missing-parent-compilation","analyzedSha":"bb72145f9ab45aee29f523236b3a25cd0813a841","analyzedAt":"2026-08-30T02:47:34.745Z","schemaVersion":2},"datasetVersion":"2026-08-30T03:17:51.788Z"}