問題タブ [webpack-html-loader]

以下のエイリアスが HTML タグや JavaScript で機能しない理由はありますか?

私のwebpack構成ファイルでは：

私のHTMLファイル（.vue）では：

webpack 構成に何か不足していますか?

htmlファイルをインポートしてjsonに変換したい。

webpack.config.js

しかし、それはエラーを発生させます...

html-webpack-plugin (および file-loader@6.2.0 と sass-loader@10.1.0) で動作するように webpack@5.10.0 (webpack-cli@4.2.0 を使用) を構成しました。

その時点まで、すべてが正常に機能しています (style.scssにインポートされindex.js、スタイルシート自体が で 2 つの jpg をロードしますbackground-image: url(...))。

ここで、私の html テンプレート ( index.html) がファイル ( ) を参照し、それが (によって、別の名前で)<img src="./file.svg">コピーされます。file-loaderただし、決勝の参照はindex.htmlこの変更を反映する必要があります。

だから私はインストールしましたhtml-loader@1.3.2：

npx webpack buildこれ以上の指示なしでクラッシュするようになりました:

それで？デバッグ情報を取得するには? 何がうまくいかなかったのですか？

テンプレートに静的 html コンポーネントをインポートしようとしていますが、

私はこの構造を持っています：

/src/home.html.ejs本体

/src/parts/header.html

/src/parts/breadcrumbs.html

webpack が構築されているとき、index.html でこれを取得しています。

ウェブパック構成:

また、開発者が html-loader でオプション interpolate を使用できる場合の解決策をいくつか見つけましたが、v0.5.5 以降の html-loader を使用しており、このオプションは削除されました

私が間違っていることは何ですか？

divの配列を作成する必要があります（画像が含まれています）。

これまでの私のコード:

私の画像はコンポーネントと同じフォルダーにあります。正しい src を挿入して webpack を正しく動作させるにはどうすればよいですか? （画像へのパスはサーバーから取得され、スライドはマップによって形成されるため、「インポート」なし）

webpack.config.js で「html-loader」を使用する必要があるかもしれませんが、方法がわかりません。試してみましたが、機能しません。

これが私のwebpack.config.jsです：