When I try to get angular/cli to generate a new component for me all it does is print the message
this.tree.readText is not a function
and exits.
I am using Ubuntu 22.04 and using ng in a console window.
I am trying to generate a new component in a feature module. I am starting ng in the feature-module directory with the following command:
ng g c components/my-new-component --change-detection OnPush
The working directory is similar to:
~/Develop/my-project/src/app/feature-module
and I'm expecting four new files to be generated in the new folder
~/Develop/my-project/src/app/feature-module/components/my-new-component/
as well as the module file
~/Develop/my-project/src/app/feature-module/feature-module.module.ts
to be updated with the newly generated component.
I'm also getting this behavior on Ubunut 20.04.
A colleague has the same problem on his Mac (an M1) when using ng on the command line, but is not really hampered as he uses IntelliJ and has an extension for generateing new components, rather than using the command line.
I've tried googling the problem without any success. I've also tried deleting node_modules along with the package-lock.json file and reinstalling all packages but to no avail.
I'm using the following node/typescript/angular versions:
_ _ ____ _ ___
/ \ _ __ __ _ _ _| | __ _ _ __ / ___| | |_ _|
/ △ \ | '_ \ / _` | | | | |/ _` | '__| | | | | | |
/ ___ \| | | | (_| | |_| | | (_| | | | |___| |___ | |
/_/ \_\_| |_|\__, |\__,_|_|\__,_|_| \____|_____|___|
|___/
Angular CLI: 13.3.8
Node: 14.19.2
Package Manager: npm 6.14.17
OS: linux x64
Angular: 13.3.11
... animations, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router
Package Version
---------------------------------------------------------
@angular-devkit/architect 0.1303.8
@angular-devkit/build-angular 13.3.8
@angular-devkit/core 14.0.3
@angular-devkit/schematics 14.0.3
@angular/cdk 13.3.9
@angular/cli 13.3.8
@angular/material 13.3.9
@schematics/angular 14.0.3
rxjs 6.6.7
typescript 4.5.5
Does anyone have any idea what I'm doing wrong?
UPDATE
I tried creating a new project, adding a feature module and adding a component to the feature module - everything worked perfectly, so I suppose the problem is being caused by something in the project (or its structure) I'm working on. This is going to be fun...
ng was exiting unexpectedly with only the message
this.tree.readText is not a function
so I went looking for this.tree.readText in the code. It seems only to be used in the @schematics package in conjuction with reading and writing the workspace. Following the suggestion by @Vega that it might be a version incompatibility issue I checked what was in angular.json against the online documentation - during the project we've continually upgraded from version 8 to 13.
There was a difference: at the end of the file was the following:
"cli": {
"defaultCollection": "@angular-eslint/schematics"
}
This was added during the migration from TSLint to ESLint. We used the angular-eslint schematic to carry out the migration:
ng add @angular-eslint/schematics
ng g @angular-eslint/schematics:convert-tslint-to-eslint
but I'm not sure anymore if this line was added automatically or whether we added the line afterwards.
In the online documentation for the Angular Workspace Configuration (cli options) there's no mention of defaultCollection, but there is a schematicCollections. By replacing the cli-options with this:
"cli": {
"schematicCollections": ["@angular-eslint/schematics"]
}
ng generate started working again. Interestingly enough the JSON-schema for the angular.json file specifies the property defaultCollection but not schematicCollections.