html-webpack-plugin2.22.0、Webpack与gulp结合时出现ReferenceError: window is not defined错误的解决办法

一、问题描述

下面是在命令行给出的错误提示：

[10:16:36] Starting 'webpack'...Unhandled rejection Error in plugin 'webpack-stream'Message:      ReferenceError: window is not defined  - index.html:50 Object.<anonymous>    D:/workspaceSet/VSCodeWorkSpace/learn-vuejs/src/index.html:50:2  - index.html:21 __webpack_require__    D:/workspaceSet/VSCodeWorkSpace/learn-vuejs/src/index.html:21:30  - index.html:41    D:/workspaceSet/VSCodeWorkSpace/learn-vuejs/src/index.html:41:18  - index.html:44    D:/workspaceSet/VSCodeWorkSpace/learn-vuejs/src/index.html:44:10  - index.js:225 HtmlWebpackPlugin.evaluateCompilationResult    [learn-vuejs]/[html-webpack-plugin]/index.js:225:26  - index.js:115    [learn-vuejs]/[html-webpack-plugin]/index.js:115:21  - util.js:16 tryCatcher    [learn-vuejs]/[bluebird]/js/release/util.js:16:23  - promise.js:504 Promise._settlePromiseFromHandler    [learn-vuejs]/[bluebird]/js/release/promise.js:504:31  - promise.js:561 Promise._settlePromise    [learn-vuejs]/[bluebird]/js/release/promise.js:561:18  - promise.js:606 Promise._settlePromise0    [learn-vuejs]/[bluebird]/js/release/promise.js:606:10

下面是各个配置文件的内容。
gulpfile.js

/** * Created by mingceng on 15/12/2. */'use strict';var gulp = require('gulp');var htmlmin = require('gulp-html-minifier');var webpack = require('webpack');var webpackConfig = require('./webpack.config.js');var stream = require('webpack-stream');gulp.task('webpack', [], function () {    return gulp.src('src/app.js')        .pipe(stream(webpackConfig))        .pipe(gulp.dest('build/dev'));});gulp.task('default', ['webpack']);

webpack.config.js

/** * Created by mingceng on 15/11/16. */var webpack = require('webpack');var path = require('path');var HtmlWebpackPlugin = require('html-webpack-plugin');var ExtractTextPlugin = require('extract-text-webpack-plugin');var config = {    // context: path.resolve(__dirname, 'src'),    entry: {        app: './src/app.js',        vendors: ['./src/lib/jynPolyfill.js', 'vue']    },    output: {        path: path.resolve(__dirname, "build/dev"),        filename: 'bundle.js'    },    module: {        noParse: [],        loaders: [            {                test: /\.js$/,                loader: 'babel',                exclude: /(node_modules|bower_components|assets)/,                query: {                    cacheDirectory: true,                    presets: ['es2015']                }            },            {                test: /\.css$/,                loader: ExtractTextPlugin.extract('style-loader', 'css-loader')            },            {                test: /\.html$/,                exclude:/assets/,                loader: "ngtemplate?relativeTo=" + (path.resolve(__dirname, './src')) + "/!html"            },            {                test: /\.woff(2)?(\?v=[0-9]\.[0-9]\.[0-9])?$/,                loader: "url-loader?limit=10000&minetype=application/font-woff"            },            {                test: /\.(ttf|eot|svg)(\?v=[0-9]\.[0-9]\.[0-9])?$/, loader: "url"            },            {                test: /\.(jpe?g|png|gif|svg)$/i,                loader: 'url?limit=8192'            }        ]    },    resolve: {         root: __dirname + '/src/',        modulesDirectories: ["node_modules", "assets"],        extensions: ['', '.js', '.es6']    },    plugins: [        new HtmlWebpackPlugin({            template: './src/index.html',            inject: 'body',            hash: true,            minify: {"removeComments": true, "collapseWhitespace": true}        }),        new webpack.DefinePlugin({'process.env.NODE_ENV': '"production"'}),        new webpack.optimize.DedupePlugin(),        new webpack.optimize.UglifyJsPlugin({            minimize: true,            sourceMap: false,            mangle: false        }),        new webpack.optimize.CommonsChunkPlugin('vendors', 'vendors.js', Infinity),        new webpack.optimize.OccurenceOrderPlugin(),        new webpack.optimize.AggressiveMergingPlugin(),        new ExtractTextPlugin('app.css', {allChunks: false})    ]};module.exports = config;

二、解决方法

把硬盘中的index.html改成index.ejs，同时把webpack.config.js配置文件里面的index.html也改成index.ejs

// 其他的代码已忽略plugins: [        new HtmlWebpackPlugin({            template: './src/index.ejs', // html后缀改成ejs后缀。            inject: 'body',            hash: true,            minify: {"removeComments": true, "collapseWhitespace": true}        }),]

然后就可以了，目前只有2.22.0版本的html-webpack-plugin存在这个问题。