如何使用HtmlWebpackPlugin在代码体中的代码之前注入包源代码？

Question

我和webpack一起使用Google，为了生成一个google地图，它应该在加载api js文件之前加载包文件。但是HtmlWebpackPlugin将包文件放在body元素的底部。如何在包文件之前加载包？这是我下面的webpack.config.js。

const webpack = require('webpack'); var HtmlWebpackPlugin = require('html-webpack-plugin'); var path = require('path');

module.exports = {
    entry: ['webpack/hot/dev-server',"./public/entry.js"],
    output: {
        path: path.resolve(__dirname, 'dist'),
        filename: "bundle-[hash].js",
        publicPath: path.resolve(__dirname, '/')
    },
    devServer: {
        hot: true,
        inline: true
    },
    module: {
        loaders: [
            { test: /\.css$/, loader: "style-loader!css-loader" },
            { test: /\.jade$/, loader: "pug-loader"}
        ]
    },
    plugins: [
        new webpack.ProvidePlugin({
            '$': 'jquery',
            'jQuery': 'jquery',
        }),
        new HtmlWebpackPlugin({ 
            template: './views/index.jade',
        })
    ],
    devServer: {
        historyApiFallback: true
    } };

控制台截图

Answer 1

试试这个：

new HtmlWebpackPlugin({ 
    template: './views/index.jade',
    inject: 'body'
})

注入：(true \x{e76f}\x{e76f} 将所有资产注入给定的模板或templateContent --当传递true或“body”时，所有javascript资源都将放在body元素的底部。“head”将把脚本放在head元素中。

有关更多详细信息，请参阅配置文档。