Angular 2 routes not working after building the project

问题

These are my routes:

import { Routes } from '@angular/router';
import {WelcomeComponent} from "./welcome/welcome.component";
import { LoginComponent } from './login/login.component';

export const routes: Routes = [
  {path: '', component: WelcomeComponent},
  {path: 'login', component: LoginComponent},
  {path: '**', component: WelcomeComponent}
];

I buid my project using ng buid.

When I enter a not defined path, I expect the application to redirect to '/' path as it happens during development, but I get an 404 Error.

I get the same error even when I manually enter /login URL.

What am I missing?

回答1:

You need to make sure if you're serving your app via a express server or any other web server , you should redirect all the get requests to index.html.

As long as your server is not redirecting all the requests to index.html, it doesn't matter what's happening inside your Angular app.

回答2:

As @Milad stated I had to redirect all get request to index.html. Adding .htacces file solved my issue:

<IfModule mod_rewrite.c>
RewriteEngine On
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^ index.html [L]
</IfModule>

回答3:

If you want to redirect, you should specify exactly that:

  { path: '**', redirectTo: '/'}

However, I recommend something like:

  {path: '/welcome', component: WelcomeComponent},
  {path: '/login', component: LoginComponent},
  {path: '**', redirectTo: '/welcome'}

Also note the leading slashes in the path.

来源：https://stackoverflow.com/questions/44065310/angular-2-routes-not-working-after-building-the-project