updated ng-cli with working project now "Cannot GET /"?

angular, angular-cli

Solution

Seems fine. Probably you didn't run `ng serve` in the project's folder.

When using CLI you have to run `ng serve` where app.module.ts lies **usually :

$ projectFolder\src\app

Problem

I had a working ng cli project which had been created with the beta.21 version of the cli. I wanted to update it to use the latest structure of the cli projects, so created a new project with the cli (v.1.0.0). I then essentially dropped the contents of my existing projects app file into the new project and went from there. Strangely though, my new project builds without issue and produces the sizes and chunks I was expecting. If I run my express based backend which serves up the contents of the `./dist` directory, then my app works as expected. However, if I run `ng serve` I get the error `Cannot GET /` in the browser. I really am not sure what could have caused this (my biggest suspicion is that my project has the file structure with `client/src/app` rather than the standard `src/app` however, I have changed all the references to the file path I could find and as the build is working, I assume that is fine)? Any ideas / suggestions on how to debug further? Update: `client/src/index.html`: ``` <!doctype html> <html> <head> <meta charset="utf-8"> <title>DemoProj</title> <base href="/"> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="icon" type="image/x-icon" href="favicon.ico"> </head> <body> <app-root>Loading...</app-root> </body> </html> ``` `.angular-cli.json`: ``` { "$schema": "./node_modules/@angular/cli/lib/config/schema.json", "project": { "name": "coty-monitoring-system" }, "apps": [ { "root": "client/src", "outDir": "dist", "assets": [ "assets", "favicon.ico" ], "index": "index.html", "main": "main.ts", "polyfills": "polyfills.ts", "test": "test.ts", "tsconfig": "tsconfig.app.json", "testTsconfig": "tsconfig.spec.json", "prefix": "app", "styles": [ "styles.css" ], "scripts": [ "../../node_modules/chart.js/dist/Chart.bundle.js", "../../node_modules/hammerjs/hammer.min.js" ], "environmentSource": "environments/environment.ts", "environments": { "dev": "environments/environment.ts", "prod": "environments/environment.prod.ts" } } ], "e2e": { "protractor": { "config": "./protractor.conf.js" } }, "lint": [ { "project": "client/src/tsconfig.app.json" }, { "project": "client/src/tsconfig.spec.json" }, { "project": "e2e/tsconfig.e2e.json" } ], "test": { "karma": { "config": "./karma.conf.js" } }, "defaults": { "styleExt": "css", "component": {} } } ``` browser network tab of failed request: Here is the page source of what the cli returns: ``` <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>Error</title> </head> <body> <pre>Cannot GET /</pre> </body> </html> ```

Original source