在 angular 中新建项目

Question

I used this command

ng new hello

to create a new project in visual studio code. It creates all the files but while installing packages, it stops and shows an error. I am copying the whole error down below:

 PS E:\Angular> ng new hello
 ? Would you like to add Angular routing? Yes
 ? Which stylesheet format would you like to use? CSS
 CREATE hello/angular.json (3558 bytes)
 CREATE hello/package.json (1281 bytes)     
 CREATE hello/README.md (1022 bytes)        
 CREATE hello/tsconfig.json (489 bytes)     
 CREATE hello/tslint.json (3125 bytes)      
 CREATE hello/.editorconfig (274 bytes)     
 CREATE hello/.gitignore (631 bytes)        
 CREATE hello/browserslist (429 bytes)      
 CREATE hello/karma.conf.js (1017 bytes)    
 CREATE hello/tsconfig.app.json (210 bytes) 
 CREATE hello/tsconfig.spec.json (270 bytes)
 CREATE hello/src/favicon.ico (948 bytes)   
 CREATE hello/src/index.html (291 bytes)
 CREATE hello/src/main.ts (372 bytes)
 CREATE hello/src/polyfills.ts (2835 bytes)
 CREATE hello/src/styles.css (80 bytes)
 CREATE hello/src/test.ts (753 bytes)
 CREATE hello/src/assets/.gitkeep (0 bytes)
 CREATE hello/src/environments/environment.prod.ts (51 bytes)
 CREATE hello/src/environments/environment.ts (662 bytes)
 CREATE hello/src/app/app-routing.module.ts (246 bytes)
 CREATE hello/src/app/app.module.ts (393 bytes)
 CREATE hello/src/app/app.component.html (25755 bytes)
 CREATE hello/src/app/app.component.spec.ts (1056 bytes)
 CREATE hello/src/app/app.component.ts (209 bytes)
 CREATE hello/src/app/app.component.css (0 bytes)
 CREATE hello/e2e/protractor.conf.js (808 bytes)
 CREATE hello/e2e/tsconfig.json (214 bytes)
 CREATE hello/e2e/src/app.e2e-spec.ts (638 bytes)
 CREATE hello/e2e/src/app.po.ts (301 bytes)
| Installing packages...npm WARN deprecated tslint@6.1.2: TSLint has been deprecated in favor of 
 ESLint. Please see https://github.com/palantir/tslint/issues/4534 for more information.
npm WARN deprecated request@2.88.2: request has been deprecated, see 
 https://github.com/request/request/issues/3142
 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 fsevents@1.2.13: fsevents 1 will break on node v14+ and could be using insecure 
 binaries. Upgrade to fsevents 2.
 npm WARN deprecated urix@0.1.0: Please see https://github.com/lydell/urix#deprecated
 npm WARN deprecated resolve-url@0.2.1: https://github.com/lydell/resolve-url#deprecated
 E:\Angular\hello\parser -> E:\Angular\hello\node_modules\@babel\parser\bin\babel-parser.js
 E:\Angular\hello\acorn -> E:\Angular\hello\node_modules\acorn\bin\acorn
 E:\Angular\hello\ansi-html -> E:\Angular\hello\node_modules\ansi-html\bin\ansi-html
 E:\Angular\hello\atob -> E:\Angular\hello\node_modules\atob\bin\atob.js
 E:\Angular\hello\cssesc -> E:\Angular\hello\node_modules\cssesc\bin\cssesc
 E:\Angular\hello\esparse -> E:\Angular\hello\node_modules\esprima\bin\esparse.js
 E:\Angular\hello\esvalidate -> E:\Angular\hello\node_modules\esprima\bin\esvalidate.js
 E:\Angular\hello\image-size -> E:\Angular\hello\node_modules\image-size\bin\image-size.js
 E:\Angular\hello\jsesc -> E:\Angular\hello\node_modules\jsesc\bin\jsesc
 E:\Angular\hello\loose-envify -> E:\Angular\hello\node_modules\loose-envify\cli.js
 E:\Angular\hello\miller-rabin -> E:\Angular\hello\node_modules\miller-rabin\bin\miller-rabin
 E:\Angular\hello\mime -> E:\Angular\hello\node_modules\mime\cli.js
 E:\Angular\hello\blocking-proxy -> E:\Angular\hello\node_modules\blocking-proxy\built\lib\bin.js
 E:\Angular\hello\json5 -> E:\Angular\hello\node_modules\json5\lib\cli.js
 E:\Angular\hello\mkdirp -> E:\Angular\hello\node_modules\mkdirp\bin\cmd.js
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@~2.1.2 
 (node_modules\rollup\node_modules\fsevents):
 npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@2.1.3: wanted 
{"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})
npm WARN notsup Unsupported engine for watchpack-chokidar2@2.0.0: wanted: {"node":"<8.10.0"} 
 (current: {"node":"12.18.0","npm":"6.14.4"})
 npm WARN notsup Not compatible with your version of node/npm: watchpack-chokidar2@2.0.0
 npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@^1.2.7 (node_modules\watchpack- 
 chokidar2\node_modules\chokidar\node_modules\fsevents): 
 npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.13: wanted 
 {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})
 npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@^1.2.7 (node_modules\webpack-dev- 
server\node_modules\chokidar\node_modules\fsevents):  
 npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.13: wanted 
 {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})

npm ERR! code EEXIST
npm ERR! path E:\Angular\hello\node_modules\browserslist\cli.js
npm ERR! dest E:\Angular\hello\browserslist
 npm ERR! EEXIST: file already exists, cmd shim 'E:\Angular\hello\node_modules\browserslist\cli.js' - 
 > 'E:\Angular\hello\browserslist'
 npm ERR! File exists: E:\Angular\hello\browserslist
 npm ERR! Remove the existing file and try again, or run npm
 npm ERR! with --force to overwrite files recklessly.

 npm ERR! A complete log of this run can be found in:
 npm ERR!     C:\Users\Dell\AppData\Roaming\npm-cache\_logs\2020-06-05T18_42_48_450Z-debug.log
 × Package install failed, see above.
 The Schematic workflow failed. See above.

I have tried re-installing everything. I have also tried updating my angular cli. I have also tried uninstalling my angular cli and cleaning the cache and then re-installing angular cli. But none of this is working. I googled alot but coud not get anything to work. I have been trying to resolve this error for a week now. I don't know what else to do. Any help would be appreciated.

UPDATE:

   internal/modules/cjs/loader.js:969
   throw err;

^

 Error: Cannot find module 
'C:\Users\Dell\AppData\Roaming\npm\node_modules\@angular\cli\bin\ng'
at Function.Module._resolveFilename (internal/modules/cjs/loader.js:966:15)
at Function.Module._load (internal/modules/cjs/loader.js:842:27)
at Function.executeUserEntryPoint [as runMain] 
(internal/modules/run_main.js:71:12)
at internal/main/run_main_module.js:17:47 {
 code: 'MODULE_NOT_FOUND',
 requireStack: []

Answer 1

Delete the node_modules directory.

Run npm install again.

Hope it helps you.

Answer 2

1. uninstall angular cli if you have already installed it

   npm uninstall -g @angular/cli

2. Delete the C:\Users\Dell\AppData\Roaming\npm\node_modules\@angular folder if it still exists after the uninstall

3. reinstall angular-cli globally

    npm install -g @angular/cli

Answer 3

here are my notes (from cmd):

node -v // must have 10.9.0 or later

npm install -g @angular/cli

ng new my-app