WebpackはHTMLファイルの画像を置き換えません

Question

私はAngpack 2アプリでWebpackを使用しています。 My Webpack設定ファイルのローダーは以下のようになります。長いサンプルコードを避けるために、プラグインとインポートを削除しました。 Webpackはcssファイルの画像をハッシュファイル名に置き換えますが、htmlファイルでは置き換えません。私が何が欠けているか分からない。どんな指針にも感謝します。

module.exports = function (options) { 
    const DATAS = { 
     VERSION: JSON.stringify(require("../package.json").version), 
     DEBUG_INFO_ENABLED: options.env === 'dev' 
    }; 
    return { 
     entry: { 
      'polyfills': './src/main/webapp/app/polyfills', 
      'global': './src/main/webapp/content/css/global.css', 
      'main': './src/main/webapp/app/app.main' 
     }, 
     resolve: { 
      extensions: ['.ts', '.js'], 
      modules: ['node_modules'] 
     }, 
     module: { 
      rules: [ 
       { test: /bootstrap\/dist\/js\/umd\//, loader: 'imports-loader?jQuery=jquery' }, 
       { 
        test: /\.ts$/, 
        loaders: [ 
         'angular2-template-loader', 
         'awesome-typescript-loader' 
        ], 
        exclude: ['node_modules/generator-jhipster'] 
       }, 
       { 
        test: /\.html$/, 
        loader: 'raw-loader', 
        exclude: ['./src/main/webapp/index.html'] 
       }, 
       { 
        test: /\.css$/, 
        loaders: ['to-string-loader', 'css-loader'], 
        exclude: /(vendor\.css|global\.css)/ 
       }, 
       { 
        test: /(vendor\.css|global\.css)/, 
        loaders: ['style-loader', 'css-loader'] 
       }, 
       { 
        test: /\.(jpe?g|png|gif|svg|woff|woff2|ttf|eot)$/i, 
        loaders: [ 
         'file-loader?hash=sha512&digest=hex&name=[hash].[ext]', 
         'image-webpack-loader?bypassOnDebug&optimizationLevel=7&interlaced=false' 
        ] 
       }, 
       { 
        test: /app.constants.ts$/, 
        loader: StringReplacePlugin.replace({ 
         replacements: [{ 
          pattern: /\/\* @toreplace (\w*?) \*\//ig, 
          replacement: function (match, p1, offset, string) { 
           return `_${p1} = ${DATAS[p1]};`; 
          } 
         }] 
        }) 
       } 
      ] 
     } 

Answer 1

あなたはあなたに何も処理せずに文字列を与えるHTMLファイル、ためraw-loaderを使用しています。代わりに、あなたが欲しいものを正確に行うhtml-loaderを使いたいと思っています。 .htmlルールを次のように変更してください。

{ 
    test: /\.html$/, 
    loader: 'html-loader', 
    exclude: ['./src/main/webapp/index.html'] 
},