テンプレートで画像をwebpackで使用する

Question

こんにちは、Webpackでテンプレート（Mustacheまたはハンドルバー）を正しく処理しようとしています。テンプレートのimg src atributesはファイルローダーによって処理されません。おそらく私はワークフローの基本的な何かを理解していないでしょうが、CSSファイルで解決された方法で作業したいと思います。ここで

はローダーに関する私のWebPACKの設定です：

loaders: [ 
     { 
      test: /\.js/, 
      loader: 'babel', 
      include: [__dirname + '/src', __dirname + '/tests'], 
      exclude: /node_modules/, 
      query: { 
       plugins: ['transform-runtime'], 
       presets: ['es2015'] 
       //presets: ['es2015-native-modules'] 
      } 
     }, 
     { 
      test: /\.scss/, 
      loader: 'style!css!postcss-loader!sass', 
      // Or 
      //loaders: ['style', 'css', 'sass'], 
     }, 
     { 
      test: /\.html/, 
      loader: 'html', 
     }, 
     { 
      test: /\.modernizrrc$/, 
      loader: "modernizr" 
     }, 
     { 
      test: /\.(jpe?g|png|gif|svg)$/i, 
      loader:'file-loader' 
     }, 
     { 
      test: /\.mustache$/i, 
      loader:'handlebars-loader' 
     }, 
    ], 

ここではサンプルテンプレートです：

<div style="border: solid 2px blue;"> 
<h2>Template fragment</h2> 
<p>{{text}}</p> 
<img id="img1" src="{{img}}" alt=""> 
<img id="img2" src="../img/btn_bubble.png" alt=""> 

私はjsファイルからテンプレートをロードすると、私は#img1に適切にIMGを挿入することができ、 #img2はそのままで、含まれても明らかに機能しません。それはテンプレートローダパッケージに依存よう

EDIT

は思えます。一部のユーザーは管理しない画像を管理できます。例えば。ハンドルバーでは、ハンドルバーテンプレートローダーとハンドルバーローダーのように見えます。しかし、他の人についてはわからないし、トピックがここで終わるならば。

Answer 1

（悲しいことに）正しいと思われるので、私は答えを編集するように促します。

一般的なウェブパックレベルの答えはないようです。したがって、それは問題のテンプレートローダーパッケージに依存します。一部のユーザーは管理しない画像を管理できます。ローダーをチェーンしてテンプレートと画像を処理するのは簡単だと思うかもしれませんが、それは簡単ではありません。入力と出力は互換性がない傾向があります。

たとえば、タスクを解決するためにはMustacheからHandlebarsに切り替える必要がありましたが、画像を読み込んでいる人の方も画像読み込みに取り組んでいるようです。