Невозможно отладить React Project с VSCode и Webpack - завершение процесса

Question

Я хочу отладить программу React с помощью веб-пакета с отладчиком VSCode.Процесс отладчика не запущен / не запускается и завершается в течение нескольких секунд.Не уверен, что мне не хватает моей настройки / конфигурации здесь для отладки этого в VSCode.Спасибо за отзыв и помощь.

VSCode версия 1.27 Webpack версия 3.5.5 Узел JS версия 10.10.0

Пример структуры папки в Mac-OS:

/Users/pj/documents/repo/proj/
/Users/pj/documents/repo/proj/webpack.config.js
/Users/pj/documents/repo/proj/webpack.dist.js
/Users/pj/documents/repo/proj/dist/
/Users/pj/documents/repo/proj/dist/app.js
/Users/pj/documents/repo/proj/dist/index.html
/Users/pj/documents/repo/proj/functions/
/Users/pj/documents/repo/proj/node_modules/
/Users/pj/documents/repo/proj/src/
/Users/pj/documents/repo/proj/src   /components/
/Users/pj/documents/repo/proj/src/fonts/
/Users/pj/documents/repo/proj/src/images/
/Users/pj/documents/repo/proj/src/pages/
/Users/pj/documents/repo/proj/src/scss/
/Users/pj/documents/repo/proj/src/app.js
/Users/pj/documents/repo/proj/src/styles.css
/Users/pj/documents/repo/proj/src/index.template.html

webpack.config.js

    var HtmlWebpackPlugin = require('html-webpack-plugin')
    const CopyWebpackPlugin = require('copy-webpack-plugin')

    var path = require('path');

    module.exports = {
        devtool: 'eval_source_map',
        context: path.resolve(__dirname, "src"),
        entry:
        [
            '../node_modules/react-hot-loader/patch',
            '../node_modules/webpack/hot/only-dev-server',
            './app.js'
        ],
    output: 
    {
        filename: 'app.js',
        path: __dirname + '/dist',
    },
    plugins: 
    [

        new HtmlWebpackPlugin({
            template: 'index.template.html',
            inject: 'body'
        }) ,
        new CopyWebpackPlugin([
            { from: 'images', to: 'images' }
        ]),
        new CopyWebpackPlugin([
            { from: 'fonts', to: 'fonts' }
        ]),
    ],

    module: 
    {

        loaders: 
            [

            {
                test: /\.woff(2)?(\?v=[0-9]\.[0-9]\.[0-9])?$/,
                loader: "url-loader?limit=10000&mimetype=application/font-woff"
            },
            {
                test: /\.(ttf|eot|svg)(\?v=[0-9]\.[0-9]\.[0-9])?$/,
                loader: "file-loader"
            },
            {
                test: /\.js$/,
                exclude: /(node_modules|bower_components)/,
                loader: 'babel-loader',
                query: 
                {
                    presets: ['es2015','react']
                }
            },

            {
                test: /\.css$/, loader: 'style-loader!css-loader'
            },
            {
                test: /\.png$/, loader: 'url-loader?limit=100000'
            },
            {
                test: /\.jpg$/, loader: 'file-loader'
            }
            ]
        }
    }

launch.json

  {

    "version": "0.2.0",
    "configurations": 
    [
        {
            "type": "chrome",
            "request": "attach",
            "name": "Attach to Chrome",
            "port": 9222,
            "webRoot": "${workspaceFolder}/node_modules",
            "sourceMaps": true,
            "trace": true,
            "sourceMapPathOverrides": 
            {
                "webpack:///*": "/*"
            }
        },
        {
            "type": "chrome",
                "request": "launch",
                "name": "Launch Chrome",
                "url": "http://localhost:8080",
                "webRoot": "${workspaceFolder}/node_modules",
                "sourceMaps": true,
                "trace": true,
                "sourceMapPathOverrides": 
                {
                    "webpack:///*": "/*"
                }
            },
            {
                "type": "node",
                "request": "launch",
                "name": "webpack", 
       "program":"/Users/pj/documents/repo/proj/node_modules/webpack/bin/webpack.js",
                "sourceMaps": true,
                "trace": true,
                "sourceMapPathOverrides": 
                {
                    "webpack:///*": "/*"
                }
            }
    ]
    }

webpack.dist.js

   var HtmlWebpackPlugin = require('html-webpack-plugin')

    const CopyWebpackPlugin = require('copy-webpack-plugin')

    var path = require('path');

module.exports = {

    cache: false,
    context: __dirname + '/src',
    entry:

        [
            './app.js'
        ],

    output: 

    {
        filename: 'app.js',
        path: __dirname + '/dist',
        publicPath : '/'
    },


    plugins: [

        new HtmlWebpackPlugin({
            template: 'index.template.html',
            inject: 'body'
        }) ,
        new CopyWebpackPlugin([
            { 
                from: 'images', to: 'images' }
        ]),
        new CopyWebpackPlugin([
            { 
                from: 'fonts', to: 'fonts' }
        ]),
    ],


    module: {


        loaders: [

            {
                test: /\.woff(2)?(\?v=[0-9]\.[0-9]\.[0-9])?$/,
                loader: "url-loader?limit=10000&mimetype=application/font-woff"
            },
            {
                test: /\.(ttf|eot|svg)(\?v=[0-9]\.[0-9]\.[0-9])?$/,
                loader: "file-loader"
            },
            {
                test: /\.js$/,
                exclude: /(node_modules|bower_components)/,
                loader: 'babel-loader',
                query: {
                    presets: ['es2015','react']
                }
             },
             {
                 test: /\.css$/, loader: 'style-loader!css-loader'
             },
             {
                 test: /\.png$/, loader: 'url-loader?limit=100000'
             },
             {
                 test: /\.jpg$/, loader: 'file-loader'
             }
        ]
    }
}

Пример файла трассировки:

…

SourceMaps.getMapForGeneratedPath: Finding SourceMap for /Users/pj/documents/repo/proj/node_modules/postcss-modules-values/node_modules/postcss/lib/rule.js by URI: data:<I deleted code here for brevity>...

SourceMaps.getMapForGeneratedPath: Using inlined sourcemap in /Users/pj/documents/repo/proj/node_modules/postcss-modules-values/node_modules/postcss/lib/rule.js
SourceMap: creating for /Users/pj/documents/repo/proj/node_modules/postcss-modules-values/node_modules/postcss/lib/rule.js
SourceMap: sourceRoot: undefined
SourceMap: sources: ["rule.es6"]
SourceMap: no sourceRoot specified, using script dirname: /Users/pj/documents/repo/proj/node_modules/postcss-modules-values/node_modules/postcss/lib
SourceMaps.scriptParsed: /Users/pj/documents/repo/proj/node_modules/postcss-modules-values/node_modules/postcss/lib/rule.js was just loaded and has mapped sources: ["/Users/pj/documents/repo/proj/node_modules/postcss-modules-values/node_modules/postcss/lib/rule.es6"]

… Lotsиз этих ошибок с похожим сообщением об ошибке в файле трассировки…

 Paths.scriptParsed: could not resolve events.js to a file with 
    pathMapping/webRoot: undefined. It may be external or served directly from the 
    server's memory (and that's OK).

…

Paths.scriptParsed: could not resolve 
/Users/pj/Documents/repo/proj/node_modules/css-loader/lib/createResolver.js to 
a file with pathMapping/webRoot: undefined. It may be external or served 
directly from the server's memory (and that's OK).

…

Paths.scriptParsed: could not resolve 
webpack:///../node_modules/webpack/buildin/module.js? to a file with 
pathMapping/webRoot: undefined. It may be external or served directly from the 
server's memory (and that's OK).