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.3OS: Windows
C:\_ng\new_ig1\Sample>igStarting 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 AngularPsst! Did you know you can also use our schematics package with Angular CLI to create and modify your projects?Read more at: www.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 & RunThe 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: 4200Build started.Installing npm packagesError 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\ngSee "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>
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,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:
Michael Seidel said:? Choose app host port: 4200Build started.Installing npm packagesError installing npm packages.
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).
npm install
npm i
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,
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_created_project.zip
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..