Error: Schematic input does not validate against the Schema: {...}, Data path "" must NOT have additional properties(...)

Question

I am creating custom schematics, which I want to use to generate component files in a separate Angular project. For this purpose I am using conditional templates relying on optional parameters declared in my schema.json file. The problem is that when I try to generate the component like this:

ng g subscription-component:component --foo --path="/app" new

I get the following error:

Error: Schematic input does not validate against the Schema: {"foo":true,"path":"/app","name":"new"}
Errors:

Data path "" must NOT have additional properties(foo).

Here is my schema.json file:

{
"$schema": "http://json-schema.org/schema",
"$id": "Schema",
"type": "object",
"properties": {
    "path": {
        "type": "string",
        "format": "path"
    },
    "name": {
        "type": "string",
        "$default": {
            "$source": "argv",
            "index": 0
        }
    },
    "foo": {
        "type": "boolean",
        "default": false
    }
},
"required": [
    "name"
]


 } 

The collection.json file in my Angular project:

{
  "$schema": "../node_modules/@angular-devkit/schematics/collection-schema.json",
  "schematics": {
    "component": {
      "aliases": [
        "c"
      ],
      "description": "A blank schematic.",
      "factory": "./subscription-component/index#subscriptionComponent",
      "schema": "./subscription-component/schema.json"
    }
  }
}

and my file:

import { Component, OnInit } from '@angular/core';

@Component({
    selector: 'app-<%= dasherize(name) %>-component',
    templateUrl: './<%= dasherize(name) %>.component.html',
    styleUrls: ['./<%= dasherize(name) %>.component.scss'],
})
export class <%= classify(name) %>Component implements OnInit <% if (foo) {%>, OnDestroy <% }%> {

<% if (foo) {%>
private readonly subscription: Subscription = new Subscription();
<% }%>

constructor() { }

ngOnInit(): void {
}

<% if (foo) {%>
ngOnDestroy(): void {
    this.subscription.unsubscribe();
}
<% }%>
}

Any idea how to fix this?

Answer 1

I removed the following code from my angular.json and it worked for me.

"schematics": {
 "@schematics/angular:component": {
   "styleext": "scss"
  }
},