htmlwebpackPlugin + Maven --我如何手动注入捆绑的大杂烩文件？

Question

我遇到了一个问题，当我安装整个Maven模块时，Maven +前端- Maven -plugin和webpack不能很好地结合在一起；简单地说，当我第一次安装Maven模块时，htmlwebpackPlugin不会注入打包的js/css文件，尽管模板是这样提供的：

    new HtmlWebpackPlugin({
        template : '../resources/public/index.html',
        filename : 'index.html',
        inject : 'body',
    })

但是，如果我在安装了整个Maven模块之后手动运行frontend-maven-plugin，它实际上会注入正确的文件，这是相当奇怪的行为。

为了解决这个问题，我想知道是否有一种手动的方式在我自己的index.html模板中注入这些捆绑的文件(我只有三个；一个css，两个js文件)？这将使构建更加一致。

我的webpack.config.js的一个片段--如您所见，如果我们不在dev中，我们会向文件名中添加大杂烩。

"use strict";
const ExtractTextPlugin = require("extract-text-webpack-plugin");
const HtmlWebpackPlugin = require('html-webpack-plugin');


let path = require('path');
let webpack = require("webpack");

const PATHS = {
    build: path.join(__dirname, '../../../target', 'classes', 'public'),
};

const env = process.env.NODE_ENV;

let isDev = false;

if(env == "dev"){
    isDev = true;
}


console.log(`Dev environment: ${isDev}`);


module.exports = {

    entry: {
        main: './js/index.jsx',
        vendor: [
            "react","react-dom","axios",
            "react-table", "mobx", "mobx-react", "mobx-utils", "lodash"],
    },
    output: {
        path: PATHS.build,
        filename: `bundle.${isDev ? '' : '[chunkhash]'}.js`
    },

    plugins: [
        new webpack.optimize.CommonsChunkPlugin({name: "vendor", filename: `/static/js/vendor.bundle.${isDev ? '' : '[chunkhash]'}.js`}),
        new ExtractTextPlugin(`/static/css/[name].${isDev ? '' : '[chunkhash]'}.css`),
        new HtmlWebpackPlugin({
            template : '../resources/public/index.html',
            filename : 'index.html',
            inject : 'body',
        })

    ],

    module: {
        loaders: [
    // Bunch of loaders
        ]
    },
};

Answer 1

我解决了这个问题--基本上是Maven/Spring将Index.html(我用作模板)放在目标文件夹之外的resources/public中，然后在目标文件夹中覆盖它--基本上覆盖了来自webpackHTMLplugin的输出，这在这种情况下是合乎逻辑的。

我通过在index.html中没有任何resources/public文件来解决这个问题，但是在webpack所在的src文件夹中只有一个template.html。因此，它Maven/Spring不会用空模板覆盖输出。