2016-10-13 2 views
1

先週、Angular-Cliで作成したAngular 2を使用してポートフォリオWebサイトを構築しました。このポートフォリオのウェブサイトは学校の割り当てです。ウェブサーバーのないangle-cliを構築

最終要件の1つは、WebサイトがWebサーバーなしで実行できることです。

私はWebサーバー(ng buildでそれを構築した後)でWebサイトを開くと、私はそれを読み込む際に問題はありません。しかし、ブラウザでローカルに開くと、各javascriptファイルに404ファイルが見つかりません。

これらのjavascriptファイルは、以下に示すインデックスページと同じディレクトリにあります。

Files are in the same directory

これはng buildによって生成された私のindex.hmtlです。

<!doctype html> 
<html> 
<head> 
    <meta charset="utf-8"> 
    <title>Hallo, ik ben Maarten.</title> 
    <base href="/"> 

    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <link rel="icon" type="image/x-icon" href="assets/favicon.ico"> 

    <link href="https://fonts.googleapis.com/css?family=Open+Sans:300,400,700" rel="stylesheet"> 
</head> 
<body> 
<app-root>Loading...</app-root> 
<script type="text/javascript" src="inline.js"></script> 
<script type="text/javascript" src="styles.bundle.js"></script> 
<script type="text/javascript" src="scripts.bundle.js"></script> 
<script type="text/javascript" src="main.bundle.js"></script> 
</body> 
</html> 

ただし、ブラウザでインデックスファイルを開くときにファイルが見つかりません。

404 - files not found

それはウェブサーバなしで角度-CLIで角度2プロジェクトのビルドを実行することは可能ですか?

おかげで、

マールテンPaauw

+0

それはサーバーなしで実行することができるというの背後にある理由は何ですか? – Katana24

+0

ウェブサイトがアーカイブされるため、将来、誰かがそれを見て、Webサーバーのような余分なプログラムなしで使用できるためです。 ICT教育機関に関する奇妙なルール。しかし、私はそれについて何もすることはできません。 – maartenpaauw

+1

これは、セキュリティ上の理由から、ローカルでファイルのロードを停止するブラウザです。 あなたはこのような何か行うことができますクロムを使用している場合: 「C:\ PathTo \ Chrome.exe」--allow-ファイル・アクセスから、ファイル をしかし、私はそれがどのように生きないとあなたの機関で http://stackoverflow.com/a/18587027/1754020 –

答えて

3

ファイルがあるため<base href="/">タグの読み込みに失敗しています。すべてのfile://要求が書き換えられるため、存在しないファイルの参照が開始されます。

リンクは作業を続けるようにNG-CLIは、./に設定することができ--base-href configuration optionを、提供:

ng build --base-href "./" 
関連する問題