私は/src/app/some-module/some-componentとsrc/public/images/user.pngのフォルダ構造を持っています。さて、私の一部のコンポーネントに画像を表示するようになっているときには、画像の数が増えるとあまりにも単純で無駄な努力をしているように、パスを../../../public/images/user.pngとしなければなりません。images/css/jsなどの静的ファイルの相対パス
静的ファイルを処理するために、angular2にルーティングメカニズムまたは相対パスが配置されていますか。私はwebpackでAngular2を使用しています。
あなたのbase hrefの外観によって異なります。例えばのために
あなたは簡単にかかわらず、コンポーネントのテンプレートがどこにあるの下に使用することができます
<base href="/src/">
を持っている場合。
<img src="public/images/user.png" />
WebPackを使用する場合は、ビルド中にパスを処理します。 <img src="...">は、プロジェクト内のファイルの物理的な場所を指し示す必要があります。
例えば、私の場合には、WebPACKをせずに、それはimg/以来
<img src="img/rhamt-square-248.png" width="172">
アプリのルート直下にあるだろう。
のWebPACKとのに対し、これは動作します：
：ERROR in ./src/app/misc/about.component.html
Module not found: Error: Can't resolve './img/rhamt-square-248.png' in '/home/ondra/work/Migration/windup-web/ui/src/main/webapp/src/app/misc'
@ ./src/app/misc/about.component.html 1:402-439
@ ./src/app/misc/about.component.ts
@ ./src/app/app.module.ts
@ ./src/main.ts
<img src="../../../img/rhamt-square-248.png" width="172">
は、そうでなければあなたは、このようなのようなコンパイルエラーを取得したいです