ignightui-cli stopped working

Hello, I am creating new project using ignightui-cli, follow steps, but at the end it fails to build.. can you check the script and tell me how to fix it.. It used to work…. I would think that cli supposed to create all that needed in the project directory.. it seems it does not.. 

C:\_ng\new_ig1\Sample>ig –version
_____ _ _ _ _ _____ _____ _ _____
|_ _| (_) | | | | |_ _| / ____| | |_ _|
| | __ _ _ __ _| |_ ___ | | | | | | | | | | | |
| | / _` | '_ \| | __/ _ \ | | | | | | | | | | | |
_| || (_| | | | | | || __/ | |__| |_| |_ | |____| |____ _| |_
|_____\__, |_| |_|_|\__\___| \____/|_____| \_____|______|_____|
__/ |
|___/

Ignite UI CLI version: 8.0.3
OS: Windows

C:\_ng\new_ig1\Sample>ig
Starting Step by step mode.
For available commands, stop this execution and use –help.

? Enter a name for your project: pj1
? Choose framework: Angular
? Choose the type of project: Ignite UI for Angular
Psst! Did you know you can also use our schematics package with Angular CLI to create and modify your projects?
Read more at: http://es.infragistics.com/…/cli-overview
? Choose project template: Default side navigation
? Choose the theme for the project: Custom
Generating project structure.
√ Project structure generated.
Git initialization failed. Install Git in order to automatically commit the project.

? Choose an action: Add component
? Choose a group: Grids & Lists
? Choose a component: Grid
? Choose one: Custom Grid
? Name your component: igGridUno
? Choose features for the igx-grid Sorting, Filtering, Row Editing
√ View 'igGridUno' added.

? Choose an action: Complete & Run
The project will be created using a Trial version of Ignite UI for Angular.
You can always run the upgrade-packages command once it's created.
? Would you like to upgrade to the licensed feed now? Yes
? Choose app host port: 4200
Build started.
Installing npm packages
Error installing npm packages.
Starting project.

> pj1@0.0.0 start
> ng serve -o "–port=4200"

An unhandled exception occurred: Cannot find module '@angular-devkit/build-angular/package.json'
Require stack:
– C:\Users\gkheysin\AppData\Roaming\npm\node_modules\@angular\cli\node_modules\@angular-devkit\architect\node\node-modules-architect-host.js
– C:\Users\gkheysin\AppData\Roaming\npm\node_modules\@angular\cli\node_modules\@angular-devkit\architect\node\index.js
– C:\Users\gkheysin\AppData\Roaming\npm\node_modules\@angular\cli\models\architect-command.js
– C:\Users\gkheysin\AppData\Roaming\npm\node_modules\@angular\cli\commands\serve-impl.js
– C:\Users\gkheysin\AppData\Roaming\npm\node_modules\@angular\cli\node_modules\@angular-devkit\schematics\tools\export-ref.js
– C:\Users\gkheysin\AppData\Roaming\npm\node_modules\@angular\cli\node_modules\@angular-devkit\schematics\tools\index.js
– C:\Users\gkheysin\AppData\Roaming\npm\node_modules\@angular\cli\utilities\json-schema.js
– C:\Users\gkheysin\AppData\Roaming\npm\node_modules\@angular\cli\models\command-runner.js
– C:\Users\gkheysin\AppData\Roaming\npm\node_modules\@angular\cli\lib\cli\index.js
– C:\Users\gkheysin\AppData\Roaming\npm\node_modules\@angular\cli\lib\init.js
– C:\Users\gkheysin\AppData\Roaming\npm\node_modules\@angular\cli\bin\ng
See "C:\Users\gkheysin\AppData\Local\Temp\2\ng-qeQMki\angular-errors.log" for further details.
(node:22508) UnhandledPromiseRejectionWarning: Error: Command failed: npm start — –port=4200
at checkExecSyncError (child_process.js:643:11)
at Object.execSync (child_process.js:679:15)
at Function.execSync (C:\Users\gkheysin\AppData\Roaming\npm\node_modules\igniteui-cli\node_modules\@igniteui\cli-core\util\Util.js:273:36)
at Object.<anonymous> (C:\Users\gkheysin\AppData\Roaming\npm\node_modules\igniteui-cli\lib\commands\start.js:82:41)
at Generator.next (<anonymous>)
at fulfilled (C:\Users\gkheysin\AppData\Roaming\npm\node_modules\igniteui-cli\lib\commands\start.js:5:58)
at processTicksAndRejections (internal/process/task_queues.js:95:5)
(Use `node –trace-warnings …` to show where the warning was created)
(node:22508) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). To terminate the node process on unhandled promise rejection, use the CLI flag `–unhandled-rejections=strict` (see nodejs.org/…/cli.html. (rejection id: 1)
(node:22508) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.

C:\_ng\new_ig1\Sample>

Hello,

From what I could say based on the provided details, the issue is your Angular project can't find the required "@angular-devkit/build-angular" dependency necessary to build your project.

My suggestion is to delete the project's node_modules folder and run the following commands:

npm install

ng update

npm update

If these steps do not help you could try to install @angular-devkit/build-angular as dev dependency using 'npm install –save-dev @angular-devkit/build-angular'.

Let me know if I may be of any further assistance.

Sincerely,

Teodosia Hristodorova

Associate Software Developer

It used to work on my workstation, now it stopped…

wonder why.. is there a way to uninstall everything related and install all back.. cli supposed to created all dependency folders, but now it is getting stopped right at the beginning of the process (Error installing npm packages).. it seems like it is stopped working right after I was able to use angular-schematics for once.. now both stopped working.. even if I fix this upstream dependency conflict the ig template for the custom grid won't be created.. 

C:\_ng\new_ig1\pj1>npm install
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: pj1@0.0.0
npm ERR! Found: jasmine-core@3.7.1
npm ERR! node_modules/jasmine-core
npm ERR! dev jasmine-core@"~3.7.0" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer jasmine-core@">=3.8" from karma-jasmine-html-reporter@1.7.0
npm ERR! node_modules/karma-jasmine-html-reporter
npm ERR! dev karma-jasmine-html-reporter@"^1.5.0" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with –force, or –legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR!
npm ERR! See C:\Users\gkheysin\AppData\Local\npm-cache\eresolve-report.txt for a full report.

npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\gkheysin\AppData\Local\npm-cache\_logs\2021-07-28T14_51_48_099Z-debug.log

I have run npm install   –save-dev @angular-devkit/build-angular then ig for the same effect.. 

How to debug this behavior.. ?

C:\_ng\new_ig1>npm install –save-dev @angular-devkit/build-angular
npm WARN deprecated urix@0.1.0: Please see github.com/…/urix
npm WARN deprecated resolve-url@0.2.1: github.com/…/resolve-url
npm WARN deprecated chokidar@2.1.8: Chokidar 2 will break on node v14+. Upgrade to chokidar 3 with 15x less dependencies.
npm WARN deprecated querystring@0.2.0: The querystring API is considered Legacy. new code should use the URLSearchParams API instead.
npm WARN deprecated uuid@3.4.0: Please upgrade to version 7 or higher. Older versions may use Math.random() in certain circumstances, which is known to be problematic. See v8.dev/…/math-random for details.

added 1167 packages, and audited 1168 packages in 2m

85 packages are looking for funding
run `npm fund` for details

5 moderate severity vulnerabilities

Some issues need review, and may require choosing
a different dependency.

Run `npm audit` for details.

C:\_ng\new_ig1>ig
Starting Step by step mode.
For available commands, stop this execution and use –help.

? Enter a name for your project: pjuno
? Choose framework: Angular
? Choose the type of project: Ignite UI for Angular
Psst! Did you know you can also use our schematics package with Angular CLI to create and modify your projects?
Read more at: http://es.infragistics.com/…/cli-overview
? Choose project template: Default side navigation
? Choose the theme for the project: Custom
Generating project structure.
√ Project structure generated.
Git initialization failed. Install Git in order to automatically commit the project.

? Choose an action: Add component
? Choose a group: Grids & Lists
? Choose a component: Grid
? Choose one: Custom Grid
? Name your component: uno
? Choose features for the igx-grid Sorting, Filtering, Row Editing
√ View 'uno' added.

? Choose an action: Complete & Run
The project will be created using a Trial version of Ignite UI for Angular.
You can always run the upgrade-packages command once it's created.
? Would you like to upgrade to the licensed feed now? Yes
? Choose app host port: 4200
Build started.
Installing npm packages
Error installing npm packages.
Starting project.

> pjuno@0.0.0 start
> ng serve -o "–port=4200"

You seem to not be depending on "@angular/core" and/or "rxjs". This is an error.
(node:4780) UnhandledPromiseRejectionWarning: Error: Command failed: npm start — –port=4200
at checkExecSyncError (child_process.js:643:11)
at Object.execSync (child_process.js:679:15)
at Function.execSync (C:\Users\gkheysin\AppData\Roaming\npm\node_modules\igniteui-cli\node_modules\@igniteui\cli-core\util\Util.js:273:36)
at Object.<anonymous> (C:\Users\gkheysin\AppData\Roaming\npm\node_modules\igniteui-cli\lib\commands\start.js:82:41)
at Generator.next (<anonymous>)
at fulfilled (C:\Users\gkheysin\AppData\Roaming\npm\node_modules\igniteui-cli\lib\commands\start.js:5:58)
at processTicksAndRejections (internal/process/task_queues.js:95:5)
(Use `node –trace-warnings …` to show where the warning was created)
(node:4780) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). To terminate the node process on unhandled promise rejection, use the CLI flag `–unhandled-rejections=strict` (see nodejs.org/…/cli.html. (rejection id: 1)
(node:4780) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.

C:\_ng\new_ig1>

 ng new create project without problems .. but ig still not working …This is error log

[error] Error: Cannot find module '@angular-devkit/build-angular/package.json'
Require stack:
– C:\Users\gkheysin\AppData\Roaming\npm\node_modules\@angular\cli\node_modules\@angular-devkit\architect\node\node-modules-architect-host.js
– C:\Users\gkheysin\AppData\Roaming\npm\node_modules\@angular\cli\node_modules\@angular-devkit\architect\node\index.js
– C:\Users\gkheysin\AppData\Roaming\npm\node_modules\@angular\cli\models\architect-command.js
– C:\Users\gkheysin\AppData\Roaming\npm\node_modules\@angular\cli\commands\serve-impl.js
– C:\Users\gkheysin\AppData\Roaming\npm\node_modules\@angular\cli\node_modules\@angular-devkit\schematics\tools\export-ref.js
– C:\Users\gkheysin\AppData\Roaming\npm\node_modules\@angular\cli\node_modules\@angular-devkit\schematics\tools\index.js
– C:\Users\gkheysin\AppData\Roaming\npm\node_modules\@angular\cli\utilities\json-schema.js
– C:\Users\gkheysin\AppData\Roaming\npm\node_modules\@angular\cli\models\command-runner.js
– C:\Users\gkheysin\AppData\Roaming\npm\node_modules\@angular\cli\lib\cli\index.js
– C:\Users\gkheysin\AppData\Roaming\npm\node_modules\@angular\cli\lib\init.js
– C:\Users\gkheysin\AppData\Roaming\npm\node_modules\@angular\cli\bin\ng
at Function.Module._resolveFilename (internal/modules/cjs/loader.js:902:15)
at Function.resolve (internal/modules/cjs/helpers.js:98:19)
at WorkspaceNodeModulesArchitectHost.resolveBuilder (C:\Users\gkheysin\AppData\Roaming\npm\node_modules\@angular\cli\node_modules\@angular-devkit\architect\node\node-modules-architect-host.js:113:41)
at ServeCommand.initialize (C:\Users\gkheysin\AppData\Roaming\npm\node_modules\@angular\cli\models\architect-command.js:80:63)
at async ServeCommand.validateAndRun (C:\Users\gkheysin\AppData\Roaming\npm\node_modules\@angular\cli\models\command.js:121:22)
at async Object.runCommand (C:\Users\gkheysin\AppData\Roaming\npm\node_modules\@angular\cli\models\command-runner.js:224:24)
at async default_1 (C:\Users\gkheysin\AppData\Roaming\npm\node_modules\@angular\cli\lib\cli\index.js:70:31)

What I also noticed is that ng cli when creates new project put into package.json different version of angular

ng new : 

"dependencies": {
"@angular/animations": "~12.1.0-",
"@angular/common": "~12.1.0-",
"@angular/compiler": "~12.1.0-",
"@angular/core": "~12.1.0-",
"@angular/forms": "~12.1.0-",
"@angular/platform-browser": "~12.1.0-",
"@angular/platform-browser-dynamic": "~12.1.0-",
"@angular/router": "~12.1.0-",
"rxjs": "~6.6.0",
"tslib": "^2.2.0",
"zone.js": "~0.11.4"
},
"devDependencies": {
"@angular-devkit/build-angular": "~12.1.3",
"@angular/cli": "~12.1.3",
"@angular/compiler-cli": "~12.1.0-",
"@types/jasmine": "~3.8.0",
"@types/node": "^12.11.1",
"jasmine-core": "~3.8.0",
"karma": "~6.3.0",
"karma-chrome-launcher": "~3.1.0",
"karma-coverage": "~2.0.3",
"karma-jasmine": "~4.0.0",
"karma-jasmine-html-reporter": "~1.7.0",
"typescript": "~4.3.2"
}

ig 

"dependencies": {
"@angular/animations": "~12.0.0",
"@angular/common": "~12.0.0",
"@angular/compiler": "~12.0.0",
"@angular/core": "~12.0.0",
"@angular/forms": "~12.0.0",
"@angular/platform-browser": "~12.0.0",
"@angular/platform-browser-dynamic": "~12.0.0",
"@angular/router": "~12.0.0",
"@infragistics/igniteui-angular": "~12.0.0",
"core-js": "^3.6.5",
"hammerjs": "^2.0.8",
"jszip": "^3.5.0",
"minireset.css": "~0.0.4",
"rxjs": "~6.6.0",
"tslib": "^2.1.0",
"web-animations-js": "^2.3.2",
"zone.js": "~0.11.4"
},
"devDependencies": {
"@angular-devkit/build-angular": "~12.0.0",
"@angular/cli": "~12.0.0",
"@angular/compiler-cli": "~12.0.0",
"@types/jasmine": "~3.6.0",
"@types/node": "^12.11.1",
"codelyzer": "^6.0.0",
"igniteui-cli": "~8.0.3",
"jasmine-core": "~3.7.0",
"jasmine-spec-reporter": "~7.0.0",
"karma": "~6.3.0",
"karma-chrome-launcher": "~3.1.0",
"karma-coverage": "~2.0.3",
"karma-jasmine": "~4.0.0",
"karma-jasmine-html-reporter": "^1.5.0",
"protractor": "~7.0.0",
"ts-node": "~9.1.1",
"tslint": "~6.1.0",
"typescript": "~4.2.3"
}

ig naturally does not create the node_module folder in the pj folder..  

Hello,

It's hard to follow the exact steps you are executing on your side. From what I could see in the provided details I could say that the angular version and igniteui-angular should be the same. Into the provided package.json the angular version is 12.1 and the igniteui-angular is 12.0. This could lead to errors on your side and my suggestion is to install the correct angular version which is 12.0.

If you already have a created project, my suggestion is to delete its node_modules folder. You could do this by running 'rm -rf /node_modules' or directly from the project folder. After that run 'npm install' and 'ng update'.

In case there is an error related to the jasmine-core version please take a look at this thread where I have already suggested how such behavior could be fixed.

Additionally,  I have created a new project using the CLI, and attached could be found the generated package.json file and a step-by-step gif.

Let me know if I may be of any further assistance.

Sincerely,

Teodosia Hristodorova

Associate Software Developer

8713.cli_5F00_created_5F00_project.zip

Hi Teodosia,

I downgrade angular to the exact version installed globally 12.0.0.. it did not help… 

when I type ig it prompt me for the pj Name and after that it creates folder with the content I am attaching.. there is no node_modules there … then after interactions apparently app folder created with all components but build fails with same message.. why node_modules failed to be added? can you check the folder content for possible clues.. 

igUno.zip

Hello Michael,

No need to try other things, as the problem I believe has presented itself at this point. New projects templates don't include node_modules (and there's quite a bit of those Angular projects rely on these days) as every creation goes through an install step. If that fails, of course some/all modules will be missing and the project won't run.
I guess we can probably handle this case better in the CLI, but it did give the indication of the problem:

[quote user=”0807E5E031A3E3AD16C7C764F256184CB42D983D”]? Choose app host port: 4200
Build started.
Installing npm packages
Error installing npm packages.[/quote]

And after you tried to manually run npm install the error is detailed enough – the same one as in the previous thread linked in a reply above and the solution for the short-term is the same: update "jasmine-core" to "~3.8.0" (and while at it you might want to adjust “karma-jasmine-html-reporter” to use tilde range like "~1.7.0" to avoid future trouble. After this npm i should be able to correctly install and the project should run.

In case you are wondering – the templates used for new Angular projects are shared between the Ignite UI CLI and our Angular schematics, so getting the same result is not surprising. The project templates in the current version are based on Angular CLI 12.0.x templates, which as discussed in the previous thread shipped with relaxed version range for the "karma-jasmine-html-reporter" package. So when a new version of that came out it got picked up and caused this trouble when installing with Node.js 16 since it does additional peer dependency checks.
That issue has been resolved in the Angular CLI and we're updating to the latest version on our end. New versions of both CLI and schematics updated to 12.1 should be out soon (most likely start of next week).

Thanks, I figure it out that npm install with sequential karma/jasmine versions update actually fixes the problem and I was able to build and run pj after all.. and yes it would be nice if CLI somehow show more pointed message as it did not occurred to me to check if the node_modules folder is there or that actually all components are added already.. errors referred to some global folder and all folders were actually there… 

Is it possible to receive message when updated CLI is available. Thanks. 

Hello Michael,

Late reply (misconfigured notifications on my end), but as with my previous post the Ignite UI CLI was updated the following week as expected, with updated templates for 12.1 (https://github.com/IgniteUI/igniteui-cli/releases) so you can grab new versions.

PS: Through GitHub you could even subscribe to get notified of release if that interests you – there's a Custom condition for Releases under the Watch feature 🙂

Thanks for update!

How exactly to update .. if I would run npm install -g igniteui-cli   it will update global version but in project folder

I still getting :  Different igniteui-cli global and local version 

Ignite UI CLI version: 8.0.4

although outside it gives me new version

Ignite UI CLI version: 8.1.0

Hello,

Here could be found a topic about updating that you might consider helpful. As it is mentioned there you could run 'ng update igniteui-cli'.

Please take a look at it and let me know if you need any further assistance.

Sincerely,

Teodosia Hristodorova

Associate Software Developer

The message for the different version is just that – something to be aware of, but doesn't necessarily mean anything is wrong. The update process linked by @Teodosia will bump to the latest and should also update the Ignite UI for Angular package too. So the message will likely be gone for now at least.

Explanation:
As there are commands that make modifications such as adding new components, the Ignite UI CLI is included locally in the project (as a dev dependency). Commands inside the project are handed off to this local version. Doing this allows for projects that haven't been updated yet to whatever version you've installed globally (e.g. project is still using Angular 11 while your global version would use 12 or the other way around) and ensures the results produced are compatible with the project state.

That's why you see the message and different version when you run outside the folder – in the latter case there's no project with local installation and thus the global one executes the command. The same principle is used in the Angular CLI and the same behavior can be observed when running `ng` commands btw 🙂