如何在浏览器上显示错误以及使用webpack在reactjs中显示哪个文件？

Question

我已经使用webpack设置了一个react环境，我的webpack配置如下：

var path = require('path');

    module.exports = {

        entry: path.resolve(__dirname, 'src') + '/app/index.js',
        output: {
            path: path.resolve(__dirname, 'dist') + '/app',
            filename: 'bundle.js',
            publicPath: '/app/'
        },
        module: {
            loaders: [
                {
                    test: /\.js$/,
                    include: path.resolve(__dirname, 'src'),
                    loader: 'babel-loader',
                    query: {
                        presets: ['react', 'es2015']
                    }
                },
                {
                    test: /\.css$/,
                    loader: 'style-loader!css-loader'
                }
            ]
        }
    };

如果我有任何语法错误，它会显示在控制台中并引用bundle.js并且无法找到我在原始文件中出错的位置。我试过了：

devServer: {
        contentBase: buildFolder
        overlay: true
    }

但它不起作用。

• 如何在浏览器屏幕中显示create-react-app节目？
• 如何引用错误来自的原始文件。