Webpack 网页包：您可能需要适当的加载程序来处理此文件类型

我是第一次使用webpack，我对webpack不是很彻底。我正在使用angular-ES6-bable，我正在尝试使用网页包angular translate

我得到以下错误：

./~/html网页包插件/lib/loader.js！中出错/src/index.html 模块解析失败：/Users/samirshah/Desktop/nuskin\u translate/node\u modules/html网页包插件/lib/loader.js/Users/samirshah/Desktop/nuskin_translate/node_modules/webpack angular translate/dist/html/html-loader.js/Users/samirshah/Desktop/nuskin_translate/src/index.html意外标记（1:0）

您可能需要适当的加载程序来处理此文件类型

我试图在模块中设置预加载程序。当我试图设置html的预加载程序时，我遇到了上述错误

preLoaders: [
    {
        test: /\.html$/,
        loader: WebPackAngularTranslate.htmlLoader()
    }
],

WebPackageAngularTranslate.jsLoader（）工作正常。我不确定WebPackageAngularTranslate.htmlLoader（）为什么抛出错误

任何人都面临过类似的问题。请帮帮我

提前谢谢

这是我的配置文件：

var path = require('path');
var webpack = require('webpack');
var HtmlWebpackPlugin = require('html-webpack-plugin');
var ExtractTextPlugin = require("extract-text-webpack-plugin");
var CopyWebpackPlugin = require('copy-webpack-plugin');
var CleanWebpackPlugin = require('clean-webpack-plugin');
var WebPackAngularTranslate = require("webpack-angular-translate");

module.exports = {
  debug: true,
  entry: {
  vendor: ["jquery", "angular"],
  bundle: ['babel-polyfill', './src/app.js'],
},
// entry: ['babel-polyfill', './src/app.js'],
 output: {
    path: path.join(__dirname, 'public'),
    filename: '[name].js'
  },
  devServer: {
    // This is required for webpack-dev-server. The path should  
    // be an absolute path to your build destination. 
    outputPath: path.join(__dirname, 'public')
  },
  plugins: [
    new HtmlWebpackPlugin({
      title: 'Website Starter',
      template: 'src/index.html',
      minify: {
        collapseWhitespace: true,
        removeComments: true,
        removeRedundantAttributes: true,
        removeScriptTypeAttributes: true,
        removeStyleLinkTypeAttributes: true
      }
    }),
    new WebPackAngularTranslate.Plugin(),
    new ExtractTextPlugin("main.css"),
    new webpack.optimize.CommonsChunkPlugin({
      name: "vendor",
      minChunks: 2
    }),
    // new webpack.optimize.UglifyJsPlugin({
    //   sourceMap: true,
    //   mangle: false,

    // }),
    new CopyWebpackPlugin([{ from: 'src/**/*.js', to: __dirname +     '/public' }]),
new CleanWebpackPlugin(['public'], {
  root: path.resolve(__dirname),
  verbose: true,
  dry: true
})],
  module: {
    preLoaders: [
        {
            test: /\.html$/,
            loader: WebPackAngularTranslate.htmlLoader()
        }],
    loaders: [
      {
                test: /\.js$/,
                loader: WebPackAngularTranslate.jsLoader()
        },
      {
        test: /\.js$/, loader: 'babel-loader', query: {
          // https://github.com/babel/babel-loader#options
          cacheDirectory: true,
          presets: ['es2015', 'stage-2']
        }, exclude: [/node_modules/, /\.spec.js$/, /\npm\.js$/]
      },
      { test: /\.css$/, loader: ExtractTextPlugin.extract("style-loader", "css-loader") },
      { test: /\.scss$/, loader: ExtractTextPlugin.extract("style-loader", "css-loader!sass-loader") },
      { test: /\.html$/, loader: 'file-loader?name=[path]/[name].[ext]', exclude: /index\.html$/ },
      { test: /\.jade$/, loader: 'file-loader?name=[path]/[name].html!jade-html?pretty=true' },
      // inline base64 URLs for <=8k images, direct URLs for the rest
      { test: /\.(png|jpg)$/, loader: 'file-loader?name=assets/images/[name].[ext]' },
      // helps to load bootstrap's css.
      {
        test: /\.woff(\?v=\d+\.\d+\.\d+)?$/,
        loader: 'file-loader?name=assets/fonts/[name].[ext]'
      },
      {
        test: /\.woff2$/,
        loader: 'file-loader?name=assets/fonts/[name].[ext]'
      },
      {
        test: /\.otf$/,
        loader: 'file-loader?name=assets/fonts/[name].[ext]'
      },
      {
        test: /\.ttf(\?v=\d+\.\d+\.\d+)?$/,
        loader: 'file-loader?name=assets/fonts/[name].[ext]'
      },
      {
        test: /\.eot(\?v=\d+\.\d+\.\d+)?$/,
        loader: 'file-loader?name=assets/fonts/[name].[ext]'
      },
      {
        test: /\.svg(\?v=\d+\.\d+\.\d+)?$/,
        loader: 'file-loader?name=assets/images/[name].[ext]'
      }
    ]
  },

  devtool: 'source-map'
};

var path=require（'path'）；
var webpack=require（'webpack'）；
var HtmlWebpackPlugin=require（'html-webpack-plugin'）；
var ExtractTextPlugin=require（“提取文本网页包插件”）；
var CopyWebpackPlugin=require（'copy-webpack-plugin'）；
var CleanWebpackPlugin=require（'clean-webpack-plugin'）；
var WebPackAngularTranslate=require（“webpack angulartranslate”）；
module.exports={
是的，
条目：{
供应商：[“jquery”，“angular”]，
捆绑：['babel-polyfill'，'./src/app.js']，
},
//条目：['babel-polyfill'，'./src/app.js']，
输出：{
path:path.join（uu dirname，'public'），
文件名：'[name].js'
},
开发服务器：{
//这是Web包开发服务器所必需的。路径应为
//是指向构建目标的绝对路径。
outputPath:path.join（\uu dirname，'public'）
},
插件：[
新HtmlWebpackPlugin({
标题：“网站启动程序”，
模板：“src/index.html”，
缩小：{
拼贴空白：对，
removeComments：对，
删除和声明：是的，
removeScriptTypeAttributes:true，
removeStyleLinkTypeAttributes:true
}
}),
新的WebPackageAngularTranslate.Plugin（），
新的ExtractTextPlugin（“main.css”），
新建webpack.optimize.commonChunkPlugin({
名称：“供应商”，
碎块：2
}),
//新建webpack.optimize.UglifyJsPlugin({
//sourceMap:true，
//mangle：错，
// }),
新的CopyWebpackPlugin（[{from:'src/***/.js'，to:\uu dirname+'/public'}]），
新的CleanWebPackagePlugin（['public']{
root:path.resolve（_dirname），
没错，
干的：真的
})],
模块：{
预紧器：[
{
测试：/\.html$/,，
加载程序：WebPackAngularTranslate.htmlLoader（）
}],
装载机：[
{
测试：/\.js$/,，
加载程序：WebPackageAngularTranslate.jsLoader（）
},
{
测试：/\.js$/，加载器：'babel loader'，查询：{
// https://github.com/babel/babel-loader#options
cacheDirectory:true，
预设：['es2015'，'stage-2']
}，排除：[/node\u modules/，/\.spec.js$/，/\npm\.js$/]
},
{test:/\.css$/，loader:ExtractTextPlugin.extract（“样式加载器”、“css加载器”）}，
{test:/\.scss$/，loader:ExtractTextPlugin.extract（“样式加载器”，“css加载器！sass加载器”）}，
{test://\.html$/，loader:'file loader？name=[path]/[name].[ext]'，exclude:/index\.html$/}，
{test:/\.jade$/，loader:'文件加载器？名称=[path]/[name].html！jade html？pretty=true'}，
//的内联base64 URL似乎index.html也与webpack一起加载，但它被排除在html加载程序配置之外。您必须包括（或不明确排除它）或不使用webpack处理它…
您需要确保加载程序与
src/index.html

这应该起作用：

   {
        test: /\.html$/,
        loader: WebPackAngularTranslate.htmlLoader(),
        exclude: /src\/index\.html$/
    }

我想说的是，只要仔细检查一下，确保您的npm安装了加载程序。另外，根据文档，您可能需要提供一个文件名作为js加载程序的参数。