angular/angular-cli · error

"filePath", "resourceType" or "data" must be specified.

Error message

"filePath", "resourceType" or "data" must be specified.

What it means

The resource loader builds a unique entry key for each resource from either a filePath, or from in-memory `data` combined with a resourceType (template/style). If none of these are supplied there is no way to identify or locate the resource, so it throws.

Source

Thrown at packages/ngtools/webpack/src/resource_loader.ts:143

    } = webpack;

    const getEntry = (): string => {
      if (filePath) {
        return `${filePath}?${NG_COMPONENT_RESOURCE_QUERY}`;
      } else if (resourceType) {
        return (
          // app.component.ts-2.css?ngResource!=!@ngtools/webpack/src/loaders/inline-resource.js!app.component.ts
          `${containingFile}-${this.outputPathCounter}.${fileExtension}` +
          `?${NG_COMPONENT_RESOURCE_QUERY}!=!${this.inlineDataLoaderPath}!${containingFile}`
        );
      } else if (data) {
        // Create a special URL for reading the resource from memory
        return `angular-resource:${resourceType},${createHash('xxhash64')
          .update(data)
          .digest('hex')}`;
      }

      throw new Error(`"filePath", "resourceType" or "data" must be specified.`);
    };

    const entry = getEntry();

    // Simple sanity check.
    if (filePath?.match(/\.[jt]s$/)) {
      throw new Error(
        `Cannot use a JavaScript or TypeScript file (${filePath}) in a component's styleUrls or templateUrl.`,
      );
    }

    const outputFilePath =
      filePath ||
      `${containingFile}-angular-inline--${this.outputPathCounter++}.${
        resourceType === 'template' ? 'html' : 'css'
      }`;
    const outputOptions = {
      filename: outputFilePath,

View on GitHub (pinned to bb72145f9a)

Solutions

1. Pass a valid `filePath` string when loading a real file resource
2. When compiling in-memory content, pass BOTH `data` and `resourceType` ('style' or 'template') plus `containingFile`
3. Log/inspect the options object before calling to confirm none of the required fields are undefined/null
4. Fix the calling code that builds the options (e.g. unresolved variable, wrong destructure)

Example fix

// before
loader.entry({ data: '<h1>hi</h1>' });
// after
loader.entry({ data: '<h1>hi</h1>', resourceType: 'template', containingFile: './app.component.ts' });

function assertEntryOptions(opts = {}) {
  const hasFile = typeof opts.filePath === 'string' && opts.filePath.length > 0;
  const hasData = opts.data != null && !!opts.resourceType;
  if (!hasFile && !hasData) throw new Error('Provide filePath, or data + resourceType');
  return opts;
}
loader.entry(assertEntryOptions(options));

function hasValidEntry(o): o is { filePath: string } | { data: string; resourceType: 'style'|'template' } {
  return (typeof o?.filePath === 'string' && o.filePath !== '') ||
    (typeof o?.data === 'string' && (o?.resourceType === 'style' || o?.resourceType === 'template'));
}

try {
  return loader.entry(options);
} catch (e) {
  if (e.message.includes('"filePath", "resourceType" or "data" must be specified')) {
    console.error('Incomplete resource entry options:', options);
  }
  throw e;
}

When it happens

Trigger: Calling `get(filePath)` with an empty/undefined path, or `compilationResult()`/`entry` without any of: `filePath`, `resourceType`+`data`. E.g. `entry({ data: '<h1>x</h1>' })` without resourceType, or `entry({})`.

Common situations: Programmatic use of the loader API where options are built dynamically and end up undefined; passing an empty string (falsy) as filePath while forgetting data/resourceType; wiring custom loaders with incomplete option objects.

Understand the failure class

Background: "missing required argument" and "the following required arguments were not provided": what required-argument errors mean and how to fix them — this error's family across 20 libraries.

Related errors

• Invalid redirect status code: ${status}. Please use one of t
• Header "${headerName}" with value "${headerValue}" is not al
• Header "x-forwarded-port" must be a numeric value.
• Header "x-forwarded-proto" must be either "http" or "https".
• Header "x-forwarded-prefix" is invalid. It must start with a

AI-assisted analysis of angular/angular-cli@bb72145f9a (2026-08-30). Data as JSON: /api/errors/9b2e2bc6ec560398. Report an issue: GitHub.