は、展開プロジェクト（NGビルド）

Question

後、角度5アプリケーション内の他のページに移動することはできません私のアプリケーションの登録済みルートに移動します。私は経由して構築プロセスの後に自分のアプリケーションを提供したいときは：

ng buildまたはng build --prod

私は、任意の経路に移動した後、404エラーを取得しています。 official tutorialを読む場合は、プロジェクトの展開と複雑な操作を行うべきではありません。

私は検索を行い、ビルドコマンドに--base-href=/オプションを追加するという提案を見つけましたが、成功しませんでした。私にhttps://www.npmjs.com/package/http-server

想定される質問：

は、私は次のHTTPサーバを使用してい

Q1：あなたが角度のアプリを提供するにはどうすればよい？

A1

：アプリケーションディレクトリにNPM-パッケージの http-server --corsコマンドを使用して、 --base-hrefよう正しく参照している

Q2：あなたのルーティング設定（ソースコード）は何ですか？

A2：私は、ソースコードは、次で、角度v5のチュートリアルを学んでいるので、特別な何かを期待していないので、私のルートは、非常に単純です：

import { NgModule }    from '@angular/core'; 
import { RouterModule, Routes } from '@angular/router'; 
import { SalesComponent }  from './sales/sales.component'; 
import { ConsumersComponent } from './consumers/consumers.component'; 

const routes: Routes = [ 
    { path: 'consumers' , component: ConsumersComponent }, 
    { path: 'sales', component: SalesComponent } 
]; 

@NgModule({ 
    imports: [ RouterModule.forRoot(routes) ], 
    exports: [ RouterModule ] 
}) 

export class AppRoutingModule { } 

AppRoutingModuleが提供されますapp.modude.tsファイル（imports: in @NgModule）。

Q3：角度アプリはバックエンド（サーバー側のアプリ）に依存していますか？

A3：です。それは、データをシミュレートするための疑似オブジェクトだけを持っています。これらは、分離されたクラスの静的データとして定義されます。公式サイトのAngularチュートリアルから遠く離れたわけではありません。私の好きな小さなHTTPサーバーでng build --prodバージョンを提供したかっただけです。

したがって、ng serveコマンドを使用すると他のページに移動できますが、プロジェクトをビルドした後も同じことができません。チュートリアルでは、ビルドされたファイルを静的なものとしてすべてのHTTPサーバーに提供することはできますが、私にとっては成功しないという説明が提供されています。

問題を解決するにはどうすればよいですか？私はofficial deployment guideため、私の問題を解決した

おかげ

Answer 1

。

フロントコントローラーパターンに従うようにHTTPサーバーを構成する必要があります。私は次の設定を使用して、nginxサーバーでそれをテストしました：

server { 
    listen 80 default_server; 
    root /var/www/html; 
    index index.html index.htm; 
    server_name localhost; 
    location/{ 
     try_files $uri $uri/ /index.html;   
    } 
} 

そして今はすべてかなりうまく動いています。

.htaccessファイルを使用している場合は、Apacheサーバーを使用している場合、またはweb.configファイルを使用している場合、IISがHTTPサーバーである場合なども同様です。