如何在vscode中调试Webpack lodader后备？有可能吗？

Question

原始的事情是我想在我的webpack配置中添加一个sprites加载器，但我无法弄清加载器后备的参数，我想调试内部的后备，但是我尝试了将近3个小时，失败

这是我的webpack.js

const path = require('path');
const webpack = require('webpack');
const autoprefixer = require('autoprefixer');
const precss = require('precss');
const cssnano = require('cssnano');
const ExtractTextPlugin = require('extract-text-webpack-plugin');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const OptimizeCssAssetsPlugin = require('optimize-css-assets-webpack-plugin');
const spritesConfig = require('./../config/spritesConfig');


const spritesConfig = {
    spritePath: 'src/images/sprites',
    stylesheetPath: 'src/views',
    spritesmith: {
        padding: 5
    },
    filterBy (image) {
        if (image.url.indexOf('/images/sprites/') === -1) {
            return Promise.reject();
        }
        return Promise.resolve();
    },
    groupBy (image) {
        const REG_SPRITES_GROUP = /\/images\/sprites\/\w+\//g;
        let groups = null;
        groups = REG_SPRITES_GROUP.exec(image.url);
        const groupName = groups ? groups[0].replace('/\/images\/sprites\/', '').replace('/', '') : 'icons';
        return Promise.resolve(groupName);
    },
    hooks: {
        onSaveSpritesheet(opts, spritesheet) {
            // the fallback I wanna go into and see the params
            const FilenameChunks = spritesheet.groups.concat(spritesheet.extension);
            return require('path').posix.join(opts.spritePath, FilenameChunks.join(','));
        }
    }
};
const env = process.env.NODE_ENV;
const __basename = path.dirname(__dirname);
const APP_CONFIG = require('../config/config');

const isDev = (env === 'develop');// 开发环境
const isPro = (env === 'production'); // 生产环境
const isDebug = (env === 'debug'); // 生产调试环境
const packConfig = {
    entry: {
        app: path.resolve(__basename, APP_CONFIG.entry)
    },
    output: {
        path: path.join(__basename, APP_CONFIG.dist),
        filename: '[name].min.js',
        publicPath: '/' + APP_CONFIG.dist + '/'
    },
    module: {
        rules: [
            {
                test: /\.js$/,
                use: [{
                    loader: 'babel-loader',
                    options: {
                        presets: ['react', 'es2015'],
                        plugins: ['transform-runtime', 'transform-object-assign']
                    }
                }],
                exclude: /node_modules/
            },
            // compile sass
            {
                test: /\.scss$/,
                use: ExtractTextPlugin.extract({
                    fallback: 'style-loader',
                    use: [
                        {
                            loader: 'css-loader'
                        },
                        {
                            loader: 'px2rem-loader',
                            options: {
                                remUint: 75,
                                remPrecision: 8
                            }
                        },
                        {
                            loader: 'postcss-loader',
                            options: {
                                plugins: () => [
                                    sprites(spritesConfig),
                                    precss(),
                                    autoprefixer({
                                        browsers: ['>0%'] // 补全兼容配置
                                    })
                                ]
                            }
                        },
                        {
                            loader: 'sass-loader'
                        }
                    ]
                }),
                exclude: /node_modules/
            }

        ]
    },
    resolve: {
        extensions: ['.js', '.vue'],
        alias: {
            rem: path.join(__basename, './src/lib/vendor/rem/index.js'),
            base: path.join(__basename, './src/lib/base/index.js'),
            log: path.join(__basename, './src/lib/vendor/logger')
        }
    },
    externals: {
        jquery: 'window.$'
    },

    // 插件
    plugins: [
        new webpack.LoaderOptionsPlugin({
            options: {
                postcss () {
                    return [
                        autoprefixer({
                            browsers: ['ie>=8', '>1% in CN']
                        })
                    ];
                }
            }
        }),
        new ExtractTextPlugin('[name].min.css'),
        new webpack.DefinePlugin({
            __DEV__: JSON.stringify(JSON.parse(isDev)),
            __ENV__: JSON.stringify(env)
        }),

        new webpack.ProvidePlugin({
            $: 'jquery',
            jQuery: 'jquery',
            'window.jQuery': 'jquery'
        }),

        new HtmlWebpackPlugin({
            filename: path.resolve(__basename, './' + APP_CONFIG.dist + '/app.html'),
            template: path.resolve(__basename, './src/views/app.html'),
            chunks: ['app'],
            hash: false,
            minify: {
                removeComments: false,
                collapseWhitespace: false
            }
        })
    ],
    devtool: ''
};

if (isPro || isDebug) {
    packConfig.output.publicPath = './';
}

if (isDev || isDebug) {
    packConfig.devtool = '#source-map';
}

module.exports = packConfig;

我希望在运行wabpack或npm时调试内部的spritesConfig.hooks.onSaveSpritesheet。

我尝试通过以下命令简单地调试webpack.js，但不会进入后备状态

node --inspect --debug-brk=5858 ./tools/webpack.js --colors