Webpack-dev-server显示目录列表而不是应用页面

Question

我正在使用react构建一个渐进式Web应用程序，我正在使用webpack dev服务器。

我的网络应用配置：

var webpack = require('webpack');
var path = require('path');

module.exports = {
    entry: [
        'webpack-dev-server/client?http://127.0.0.1:8080',
        'webpack/hot/only-dev-server',
        './src/index.jsx'
    ],
    output: {
        path: path.join(__dirname,'public'),
        filename: 'bundle.js',
         publicPath: 'http://localhost:8080'
    },
    devServer: {
        contentBase: "./public",
        hot: true
    },
    resolve: {
        modulesDirectories: ['node_modules','src'],
        extensions: ['','.js']
    },
    module: {
        loaders: [
            {
                test: /\.jsx?$/,
                exclude: /node_modules/,
                loaders: ['react-hot','babel?presets[]=react,presets[]=react,presets[]=es2015']
            }

        ]
    },
    plugins:[
        new webpack.HotModuleReplacementPlugin(),
        new webpack.NoErrorsPlugin()
    ]
};

这是我的目录结构：

请帮助我，因为我无法看到我的index.html。 我的配置文件有什么问题

Answer 1

您的index.html位于"src"文件夹中 所以你的webpack.config.js应该这样：

devServer: {
    contentBase: "./src",
    hot: true
},