問題タブ [webpack-html-loader]

なんらかの理由で、webpack は生成したバンドルに HTML ファイルをバンドルしません。他のすべてがバンドルされていますが、残念ながら私の HTML ファイルはバンドルされていません。

私はAngular 2を使用しており、以下への依存関係を含めています:

webpack.config:

webpack.common:

そして webpack.prod:

そして、次の方法でコンポーネントに HTML を取り込みます。

docsから知る限り、それで十分だと思いますが、まだ何かが欠けています。

raw-loader も使用してみましたが、これも HTML ファイルのバンドルに失敗したことに注意してください。インポートの形式を「require("html!./file.html");」に近づける必要があるのではないかと考えました。だから私もそれを試しましたが、成功しませんでした。エラーやデバッグ情報は得られません。残念ながら、HTML ファイルが不足しているだけです。何か案は？

webpack を使用して HTML ファイルを文字列としてインポートしようとしています (TypeScript 2.0 は非 ES6 ターゲットで async/await をサポートしていないため、現在 webpack を使用しています)。

私が抱えている問題は、github の html-loader バージョンが構成フラグ「exportAsEs6Default」をサポートしていても、正しく設定できないことです。ローダー オプションをグローバルに設定する方法はありますか? 構成ファイルのローダー セクションに html-loader を追加すると、ローダーが 2 回呼び出され、コンテンツがネストされるためです。

HTML のインポートをサポートする次の定義ファイルがあります (モジュールのドキュメントの例のように)

対応する import ステートメント:

私が使用するパッケージのバージョン:

そしてwebpack構成ファイル

たとえば、test.htmlファイルがある場合、コードは次のとおりです。

私html-loaderはそれを要求するために使用します:

および変数htmlprint:

style-> .test->background正しい URL を取得できません。それを解決する方法?

これは私のwebpack設定コードですhtml-loader：

パグファイルには次の構成があります...

これはうまく機能し、url-loader を使用してロードする画像を追加したいと考えています。私の構造はこのようなものです

そして、pngを含めたいので、追加するパグファイルに...

img(src="thing.png")

これは解決しないので、次のようなことを試しimg(src=require("thing.png"))ました。これらのどれも機能しません。このようにhtml-loaderを追加してみました...

しかし、それから私は...

これはすべて、私のスタイラスで正常に動作します...

私も試しました...

そして得るCannot read property 'png' of undefined

また、そこにあるhtmlでその行をコメントアウトすると...

パグで画像を要求するにはどうすればよいですか?

html-loader を使用する<img>と、index.html のタグが url-loader をトリガーしませんでした。ここに私のwebpack構成とhtmlがあります:

webpack構成

index.html:

エラーログ: