問題タブ [webpack-html-loader]

webpack.config.js に 2 つのエントリがあります。1 つは JS 用で、もう 1 つは SCSS 用です。開発モードと製品モードで実行できます。プロダクション ビルドを作成すると、index.html、main[hash].js、main[hash].css というファイルが得られます。index.htmlsrcには、ファイルへのリンクとスクリプト タグがあります。base.twigアプリケーションのデプロイ時に読み込まれるこれらのリンクとスクリプト タグをファイルに読み込むにはどうすればよいですか? main.js開発中はから をロードしbase.twig、そのファイルにはすべてが含まれています。

base.twig

フォルダ構造:

index.html

webpack.config.js

更新された構造:

grunt を使用したプロジェクトを webpack に移動しています。

さまざまなファイルで HTML コンポーネントを再利用するために、HTML スニペットを頻繁に使用しています。

変数の受け渡しを必要としない HTML インクルードには、webpack html-loader を使用しています。

そうする人のために、私は口ひげとhtml-loaderを一緒に使用しています。

これはトップ レベルではうまく機能していますが、再帰的ではないため、別のスニペットを含むスニペットはインクルード コードを表示するだけで、補間された HTML は表示しません。

実演する最も簡単な方法は、問題を実演する簡単なレポを作成することでした: https://github.com/JamieMcDonnell/webpack-html-loader

私のHTMLテンプレートは次のとおりです。

最初の 2 つのインクルードは問題なくインポートされます。

3 番目の recursive.html は次のようになります。

sub/sub.html と sub/variable.html は非常にシンプルで、動作するはずです。再帰的な読み込みなどを有効にするためのプロパティまたは何かが不足していると思いますが、それを見つけることができません。

結果は /dist/ フォルダーで確認してください。ここで私が間違っていることを誰かが見ることができますか?

あなたの時間と助けをありがとう;）