Angular 4 - All routes not working

Question

I have an Angular app working properly at localhost:4200 by using ng serve ; The node server is at localhost:3000 .

When i do ng build a bundle file is being created and served properly at localhost:3000 because of app.use(express.static(path.join(__dirname, 'path/to/dist'))); but the routes which worked at localhost:4200/user/id is giving an error at localhost:3000/user/id stating it Cannot GET /user/id .

Any ideas what is causing the problem? I have included <base href="/"> in the index.html file.

Answer 1

Sounds like your Routing Location Strategy is causing the issue.

Notes straight from Google:
Angular 4 documentation

URL depending on your chosen strategy:
PathLocationStrategy: localhost:3000/user/id
HashLocationStrategy: localhost:3000/#/user/id

You can modify useHash property in your app module to switch between the two:

@NgModule({
  imports: [
    BrowserModule,
    FormsModule,
    RouterModule.forRoot(routes, { useHash: true })  // .../#/user/id
  ], ...
});

That said, if you mismatch the URLs, your GET should fail.