Webpack HTML-webpack-plugin failed to create html?

  node.js, question

webpack.config.jsThe code is as follows

var path = require('path');
 var webpack = require('webpack');
 
 
 var distPath = path.join(__dirname, '/public/dist/');
 
 var HtmlWebpackPlugin = require('html-webpack-plugin');
 
 module.exports = {
 entry: './components/main.js',
 output: {
 path: distPath,
 publicPath: "/public/dist/",
 filename: '[name].js'
 },
 module: {
 loaders: [
 {test: /\.html$/,loader: "html"},
 { test: /\.js?  $/, loaders: ['jsx?  harmony']}
 bracket
 },
 resolve: {
 alias: {
 Jwplayer: __dirname plus'/public/static/plugins/jwplayer-7.3.4/jwplayer.js'
 bracket
 },
 plugins: [
 new HtmlWebpackPlugin({
 filename: 'index.html',
 template: 'm_vol.html'
 })
 bracket
 };

Error message

ERROR in   Error: Child compilation failed:
 Entry module not found: Error: Cannot resolve 'file' or 'directory' D:\luoo\nodejs\m_vol.html in D:\luoo\nodejs:
 Error: Cannot resolve 'file' or 'directory' D:\luoo\nodejs\m_vol.html in D:\luoo\nodejs
 
 - compiler.js:88
 [nodejs]/[html-webpack-plugin]/lib/compiler.js:88:16
 
 - Compiler.js:214 Compiler.<anonymous>
 [nodejs]/[webpack]/lib/Compiler.js:214:10
 
 - Compiler.js:403
 [nodejs]/[webpack]/lib/Compiler.js:403:12
 
 - Tapable.js:67 Compiler.next
 [nodejs]/[tapable]/lib/Tapable.js:67:11
 
 - CachePlugin.js:40 Compiler.<anonymous>
 [nodejs]/[webpack]/lib/CachePlugin.js:40:4
 
 - Tapable.js:71 Compiler.applyPluginsAsync
 [nodejs]/[tapable]/lib/Tapable.js:71:13
 
 - Compiler.js:400 Compiler.<anonymous>
 [nodejs]/[webpack]/lib/Compiler.js:400:9
 
 - Compilation.js:577 Compilation.<anonymous>
 [nodejs]/[webpack]/lib/Compilation.js:577:13
 
 - Tapable.js:60 Compilation.applyPluginsAsync
 [nodejs]/[tapable]/lib/Tapable.js:60:69
 
 - Compilation.js:572 Compilation.<anonymous>
 [nodejs]/[webpack]/lib/Compilation.js:572:10
 
 - Tapable.js:60 Compilation.applyPluginsAsync
 [nodejs]/[tapable]/lib/Tapable.js:60:69
 
 - Compilation.js:567 Compilation.<anonymous>
 [nodejs]/[webpack]/lib/Compilation.js:567:9
 
 - Tapable.js:60 Compilation.applyPluginsAsync
 [nodejs]/[tapable]/lib/Tapable.js:60:69
 
 - Compilation.js:563 Compilation.<anonymous>
 [nodejs]/[webpack]/lib/Compilation.js:563:8
 
 - Tapable.js:60 Compilation.applyPluginsAsync
 [nodejs]/[tapable]/lib/Tapable.js:60:69
 
 - Compilation.js:525 Compilation.seal
 [nodejs]/[webpack]/lib/Compilation.js:525:7
 
 - Compiler.js:397 Compiler.<anonymous>
 [nodejs]/[webpack]/lib/Compiler.js:397:15
 
 - Tapable.js:103
 [nodejs]/[tapable]/lib/Tapable.js:103:11
 
 - Compilation.js:445 Compilation.<anonymous>
 [nodejs]/[webpack]/lib/Compilation.js:445:10
 
 - Compilation.js:344 Compilation.errorAndCallback
 [nodejs]/[webpack]/lib/Compilation.js:344:3
 
 - Compilation.js:358 Compilation.<anonymous>
 [nodejs]/[webpack]/lib/Compilation.js:358:11
 
 - NormalModuleFactory.js:29 onDoneResolving
 [nodejs]/[webpack]/lib/NormalModuleFactory.js:29:20
 
 - NormalModuleFactory.js:85
 [nodejs]/[webpack]/lib/NormalModuleFactory.js:85:20
 
 - async.js:726
 [nodejs]/[webpack]/[async]/lib/async.js:726:13
 
 - async.js:52
 [nodejs]/[webpack]/[async]/lib/async.js:52:16
 
 - async.js:241 done
 [nodejs]/[webpack]/[async]/lib/async.js:241:17
 
 - async.js:44
 [nodejs]/[webpack]/[async]/lib/async.js:44:16
 
 - async.js:723
 [nodejs]/[webpack]/[async]/lib/async.js:723:17
 
 - async.js:167
 [nodejs]/[webpack]/[async]/lib/async.js:167:37
 
 - UnsafeCachePlugin.js:24
 [nodejs]/[enhanced-resolve]/lib/UnsafeCachePlugin.js:24:19
 
 
 Child html-webpack-plugin for "index.html":
 
 ERROR in Entry module not found: Error: Cannot resolve 'file' or 'directory' D:\luoo\nodejs\m_vol.html in D:\luoo\nodejs

directory structure
图片描述

Why is this happening? Seeking Guidance and Solving Doubts

Npminstall-savefile-loader problem can be solved.