Error: Cannot find module '@angular-devkit/core'

Hi Guys, You might have faced this error "Error: Cannot find module '@angular-devkit/core'" while calling the command "ng serve". The full stack trace is as below .





module.js:487
    throw err;
    ^

Error: Cannot find module '@angular-devkit/core'
    at Function.Module._resolveFilename (module.js:485:15)
    at Function.Module._load (module.js:437:25)
    at Module.require (module.js:513:17)
    at require (internal/module.js:11:18)
    at Object.<anonymous> (F:\shahbaz\study\angular4\projects\my-fifth-app\test5\node_modules\@angular-devkit\schematics\src\tree\virtual.js:10:16)
    at Module._compile (module.js:569:30)
    at Object.Module._extensions..js (module.js:580:10)
    at Module.load (module.js:503:32)
    at tryModuleLoad (module.js:466:12)
    at Function.Module._load (module.js:458:3)


To fix just change the following property in package.json
"@angular/cli": "1.6.0",
to
"@angular/cli": "^1.6.0",

Once done run npm update

This should solve the problem.

The "@angular/compiler-cli" package was not properly installed.

Hi Guys, You might have faced this error "The "@angular/compiler-cli" package was not properly installed. Error: Error: Cannot find module '@angular/compiler-cli'" while calling the command "ng serve". The full stack trace is as below


The "@angular/compiler-cli" package was not properly installed. Error: Error: Cannot find module '@angular/compiler-cli'
Error: The "@angular/compiler-cli" package was not properly installed. Error: Error: Cannot find module '@angular/compiler-cli'
    at Object.CompilerCliIsSupported (C:\Users\user\AppData\Roaming\npm\node_modules\@angular\cli\node_modules\@ngtools\webpack\src\ngtools_api.js:25:15)
    at new AotPlugin (C:\Users\user\AppData\Roaming\npm\node_modules\@angular\cli\node_modules\@ngtools\webpack\src\plugin.js:29:23)
    at _createAotPlugin (C:\Users\user\AppData\Roaming\npm\node_modules\@angular\cli\models\webpack-configs\typescript.js:92:16)
    at Object.getNonAotConfig (C:\Users\user\AppData\Roaming\npm\node_modules\@angular\cli\models\webpack-configs\typescript.js:100:19)
    at NgCliWebpackConfig.buildConfig (C:\Users\user\AppData\Roaming\npm\node_modules\@angular\cli\models\webpack-config.js:33:37)
    at Class.run (C:\Users\user\AppData\Roaming\npm\node_modules\@angular\cli\tasks\serve.js:71:98)
    at check_port_1.checkPort.then.port (C:\Users\user\AppData\Roaming\npm\node_modules\@angular\cli\commands\serve.js:123:26)
    at <anonymous>
    at process._tickCallback (internal/process/next_tick.js:169:7)

It can due to various reasons ,
1. Your node_modules folder is not having the required modules .
Check the node_modules folder and see if it has all the modules. If the modules are missing just do npm install
2. If the modules are available check the version of typescript , nodejs and angular cli.
3. If nothing works create a new project using ng new project-name and replace the src directory.

ERROR Error: Uncaught (in promise): Error: Cannot match any routes. URL Segment:

Hi Guys,

This blog is about issues I have faced while creating a route in Angular 5.

When I try to hit a url "http://localhost:4200/home", I faced the following error.

Error: Cannot match any routes. URL Segment: 'home'
    at ApplyRedirects.noMatchError (router.js:1719)
    at CatchSubscriber.eval [as selector] (router.js:1684)
    at CatchSubscriber.error (catchError.js:105)
    at MapSubscriber.Subscriber._error (Subscriber.js:131)
    at MapSubscriber.Subscriber.error (Subscriber.js:105)
    at MapSubscriber.Subscriber._error (Subscriber.js:131)
    at MapSubscriber.Subscriber.error (Subscriber.js:105)
    at MapSubscriber.Subscriber._error (Subscriber.js:131)
    at MapSubscriber.Subscriber.error (Subscriber.js:105)
    at LastSubscriber.Subscriber._error (Subscriber.js:131)
    at ApplyRedirects.noMatchError (router.js:1719)
    at CatchSubscriber.eval [as selector] (router.js:1684)
    at CatchSubscriber.error (catchError.js:105)
    at MapSubscriber.Subscriber._error (Subscriber.js:131)
    at MapSubscriber.Subscriber.error (Subscriber.js:105)
    at MapSubscriber.Subscriber._error (Subscriber.js:131)
    at MapSubscriber.Subscriber.error (Subscriber.js:105)
    at MapSubscriber.Subscriber._error (Subscriber.js:131)
    at MapSubscriber.Subscriber.error (Subscriber.js:105)
    at LastSubscriber.Subscriber._error (Subscriber.js:131)
    at resolvePromise (zone.js:821)
    at resolvePromise (zone.js:785)
    at eval (zone.js:870)
    at ZoneDelegate.invokeTask (zone.js:421)
    at Object.onInvokeTask (core.js:4744)
    at ZoneDelegate.invokeTask (zone.js:420)
    at Zone.runTask (zone.js:188)
    at drainMicroTaskQueue (zone.js:594)

The fix is pretty simple .When I added the following line in app.module.ts file , it worked.

const appRoutes:Routes =[
	{path:'home',component: HomeComponent}
	];

If you are facing the same error even after adding this piece of  code then check if you have added a slash in the path {path :'\home' . Remove the slash if you have added it.

view the full source in Git