Angular 2+, How to generate angular.json manually

Question

I had built Angular sample Tour of Heroes app as on https://github.com/garg10may/TourOfHeroes

now when I try to clone it and do ng serve it gives me an error

The serve command requires to be run in an Angular project, but a project definition could not be found.

From what I understand I didn't commit angular.json file hence it not recognizing the same. How can I generate the same?

Edit:

If I use angular.json file from another new project gives the error.

Could not find module "@angular-devkit/build-angular" from "/home/garg10may/TourOfHeroes".
Error: Could not find module "@angular-devkit/build-angular" from "/home/garg10may/TourOfHeroes".
    at Object.resolve (/usr/local/lib/node_modules/@angular/cli/node_modules/@angular-devkit/core/node/resolve.js:151:11)
    at WorkspaceNodeModulesArchitectHost.resolveBuilder (/usr/local/lib/node_modules/@angular/cli/node_modules/@angular-devkit/architect/node/node-modules-architect-host.js:31:40)
    at ServeCommand.initialize (/usr/local/lib/node_modules/@angular/cli/models/architect-command.js:135:55)
    at process._tickCallback (internal/process/next_tick.js:68:7)
    at Function.Module.runMain (internal/modules/cjs/loader.js:757:11)
    at startup (internal/bootstrap/node.js:283:19)
    at bootstrapNodeJSCore (internal/bootstrap/node.js:622:3)

Trying to install the same:

garg10may@GCES15511:~/TourOfHeroes$ npm i @angular-devkit/build-angular --save-dev                                                                                                                                                  [24/1952]npm WARN checkPermissions Missing write access to /home/garg10may/TourOfHeroes/node_modules/@babel/types
npm WARN checkPermissions Missing write access to /home/garg10may/TourOfHeroes/node_modules/assert
npm WARN checkPermissions Missing write access to /home/garg10may/TourOfHeroes/node_modules/babel-code-frame
npm WARN checkPermissions Missing write access to /home/garg10may/TourOfHeroes/node_modules/@babel/generator
npm WARN checkPermissions Missing write access to /home/garg10may/TourOfHeroes/node_modules/@babel/traverse
npm WARN checkPermissions Missing write access to /home/garg10may/TourOfHeroes/node_modules/babel-generator
npm WARN checkPermissions Missing write access to /home/garg10may/TourOfHeroes/node_modules/body-parser
npm WARN checkPermissions Missing write access to /home/garg10may/TourOfHeroes/node_modules/express
npm WARN checkPermissions Missing write access to /home/garg10may/TourOfHeroes/node_modules/handlebars
npm WARN checkPermissions Missing write access to /home/garg10may/TourOfHeroes/node_modules/del/node_modules/globby
npm WARN checkPermissions Missing write access to /home/garg10may/TourOfHeroes/node_modules/del
npm WARN checkPermissions Missing write access to /home/garg10may/TourOfHeroes/node_modules/engine.io
npm WARN checkPermissions Missing write access to /home/garg10may/TourOfHeroes/node_modules/engine.io-client
npm WARN checkPermissions Missing write access to /home/garg10may/TourOfHeroes/node_modules/@angular-devkit/build-optimizer
npm WARN checkPermissions Missing write access to /home/garg10may/TourOfHeroes/node_modules/@angular/compiler-cli
npm WARN checkPermissions Missing write access to /home/garg10may/TourOfHeroes/node_modules/codelyzer
npm WARN checkPermissions Missing write access to /home/garg10may/TourOfHeroes/node_modules/@babel
npm WARN checkPermissions Missing write access to /home/garg10may/TourOfHeroes/node_modules
npm WARN checkPermissions Missing write access to /home/garg10may/TourOfHeroes/node_modules/engine.io-client/node_modules
npm WARN checkPermissions Missing write access to /home/garg10may/TourOfHeroes/node_modules/engine.io/node_modules
npm WARN checkPermissions Missing write access to /home/garg10may/TourOfHeroes/node_modules/@angular/compiler-cli/node_modules
npm WARN checkPermissions Missing write access to /home/garg10may/TourOfHeroes/node_modules/babel-code-frame/node_modules
npm WARN checkPermissions Missing write access to /home/garg10may/TourOfHeroes/node_modules/@angular-devkit
npm WARN checkPermissions Missing write access to /home/garg10may/TourOfHeroes/node_modules/del/node_modules
npm WARN checkPermissions Missing write access to /home/garg10may/TourOfHeroes/node_modules/@angular
npm WARN checkPermissions Missing write access to /home/garg10may/TourOfHeroes/node_modules/@types
npm ERR! path /home/garg10may/TourOfHeroes/node_modules/@babel/types
npm ERR! code EACCES
npm ERR! errno -13
npm ERR! syscall access
npm ERR! Error: EACCES: permission denied, access '/home/garg10may/TourOfHeroes/node_modules/@babel/types'
npm ERR!  { [Error: EACCES: permission denied, access '/home/garg10may/TourOfHeroes/node_modules/@babel/types']
npm ERR!   stack:
npm ERR!    'Error: EACCES: permission denied, access \'/home/garg10may/TourOfHeroes/node_modules/@babel/types\'',
npm ERR!   errno: -13,
npm ERR!   code: 'EACCES',
npm ERR!   syscall: 'access',
npm ERR!   path: '/home/garg10may/TourOfHeroes/node_modules/@babel/types' }
npm ERR!
npm ERR! The operation was rejected by your operating system.
npm ERR! It is likely you do not have the permissions to access this file as the current user
npm ERR!
npm ERR! If you believe this might be a permissions issue, please double-check the
npm ERR! permissions of the file and its containing directories, or try running
npm ERR! the command again as root/Administrator (though this is not recommended).

npm ERR! A complete log of this run can be found in:
npm ERR!     /home/garg10may/.npm/_logs/2019-06-07T06_33_30_442Z-debug.log
garg10may@GCES15511:~/TourOfHeroes$
garg10may@GCES15511:~/TourOfHeroes$
garg10may@GCES15511:~/TourOfHeroes$ sudo npm i @angular-devkit/build-angular --save-dev
npm ERR! path /home/garg10may/TourOfHeroes/node_modules/@babel/highlight
npm ERR! code EACCES
npm ERR! errno -13
npm ERR! syscall rename
npm ERR! Error: EACCES: permission denied, rename '/home/garg10may/TourOfHeroes/node_modules/@babel/highlight' -> '/home/garg10may/TourOfHeroes/node_modules/@babel/.highlight.DELETE'
npm ERR!  { [Error: EACCES: permission denied, rename '/home/garg10may/TourOfHeroes/node_modules/@babel/highlight' -> '/home/garg10may/TourOfHeroes/node_modules/@babel/.highlight.DELETE']
npm ERR!   cause:
npm ERR!    { Error: EACCES: permission denied, rename '/home/garg10may/TourOfHeroes/node_modules/@babel/highlight' -> '/home/garg10may/TourOfHeroes/node_modules/@babel/.highlight.DELETE'
npm ERR!      errno: -13,
npm ERR!      code: 'EACCES',  
npm ERR!      syscall: 'rename',
npm ERR!      path: '/home/garg10may/TourOfHeroes/node_modules/@babel/highlight',
npm ERR!      dest:
npm ERR!       '/home/garg10may/TourOfHeroes/node_modules/@babel/.highlight.DELETE' },
npm ERR!   stack:
npm ERR!    'Error: EACCES: permission denied, rename \'/home/garg10may/TourOfHeroes/node_modules/@babel/highlight\' -> \'/home/garg10may/TourOfHeroes/node_modules/@babel/.highlight.DELETE\'',
npm ERR!   errno: -13,
npm ERR!   code: 'EACCES',
npm ERR!   syscall: 'rename',
npm ERR!   path: '/home/garg10may/TourOfHeroes/node_modules/@babel/highlight',
npm ERR!   dest:
npm ERR!    '/home/garg10may/TourOfHeroes/node_modules/@babel/.highlight.DELETE',
npm ERR!   parent: 'angular-tour-of-heroes' }
npm ERR!
npm ERR! The operation was rejected by your operating system.
npm ERR! It is likely you do not have the permissions to access this file as the current user
npm ERR!
npm ERR! If you believe this might be a permissions issue, please double-check the
npm ERR! permissions of the file and its containing directories, or try running
npm ERR! the command again as root/Administrator (though this is not recommended).

npm ERR! A complete log of this run can be found in:
npm ERR!     /home/garg10may/.npm/_logs/2019-06-07T06_35_12_613Z-debug.log

Generate new project from Angular CLI and copy angular.json file... I think this should work — Krzysztof Raciniewski
– Krzysztof Raciniewski, Commented Jun 7, 2019 at 6:26
The tutorial should be sufficient to get you started. As it is, this question is unanswerable. — theMayer
– theMayer, Commented Jun 7, 2019 at 6:33
If the npm install of the devkit doesnt help, restart IDE. Also check the version of the build-angular kit. There are some known issues. Had this errors the last couple of days too because of a big merge of two projects. — liqSTAR
– liqSTAR, Commented Jun 7, 2019 at 6:33
We can't answer you without your file structure and the command you have ran (with the location of where you ran it). Please provide a minimal reproducible example. — user4676340
– user4676340, Commented Jun 7, 2019 at 6:36

garg10may · Accepted Answer · 2019-06-07 08:04:38Z

2

You would also need tsconfig.app.json along with angular.json copy over these files from a new project.

Now run

npm update --> npm install --> ng serve

Remember to run all commands as sudo.

edited Jun 7, 2019 at 8:04

garg10may

6,24812 gold badges58 silver badges98 bronze badges

answered Jun 7, 2019 at 6:38

Gurpreet Singh

3,1315 gold badges22 silver badges36 bronze badges

Sign up to request clarification or add additional context in comments.

9 Comments

garg10may Over a year ago

it throws permission denied error for babel, posted in quesiton

Gurpreet Singh Over a year ago

@garg10may are you updating your angular app version ?

garg10may Over a year ago

yes used sudo command, have angular 8 globally and angular 7 for app

Gurpreet Singh Over a year ago

@angular-devkit/build-angular this is introducing in angular 6.

garg10may Over a year ago

ok, I checked out the project again needed to add angular.json and tsconfig.json both were missing. Ran npm update --> npm install --> ng serve didin't get any error this time. I think npm update was the essential one which fixed all this. thx for suggesting that.

|

rogerfernandes · Accepted Answer · 2019-06-07 07:32:03Z

1

Just made a test. Created a new project with ng new and add all files (not only the angular.json) that were missing. The project ran nicely. Your question is probably duplicate from this one: Angular6: How can I generate a default angular.json file from command line

answered Jun 7, 2019 at 7:32

rogerfernandes

1932 silver badges11 bronze badges

Collectives™ on Stack Overflow

Angular 2+, How to generate angular.json manually

2 Answers 2

9 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

9 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related