Webpack-dev-server: How to use node debug `webpack-dev-server` proxy?

Created on 28 Sep 2016  路  3Comments  路  Source: webpack/webpack-dev-server

 config.devServer = {
        contentBase: dist,
        historyApiFallback: true,
        colors: true,
        port: config.port,
        proxy: {
            '**': {
                target: 'http://apis.juhe.cn',
                secure: false,
                changeOrigin: true,
                bypass: (req, res, opt) => {
                    //I want to add a debug here!!
                    if (req.headers.accept.indexOf('html') !== -1) {
                        return dist + '/index.html';
                    }
                }
            } 
        }
    };

I want to use node debug webpack-dev-server proxy bypass function. How can i do it?

question

Most helpful comment

For those coming from Google ... I was trying to do this too. I also suggest following the advice above to check on stackoverflow questions (http://stackoverflow.com/questions/tagged/webpack) and add some search terms to that webpack tag. However, that doesn't really impact _the master SEO index of doom_. I arrived on this page and no README is going to change that.

Node has deprecated debug in favor of inspect. So maybe change your Google search term to _inspect_.

A way to do it is to just run node with inspect.

node --inspect node_modules/webpack-dev-server/bin/webpack-dev-server.js
Debugger listening on ws://127.0.0.1:9229 ....

It picked a default port of 9229. Great.
Then (in whatever tool or IDE) you can set breakpoints and attach. If you create a new debug run configuration it will also use a default port of 9229. Set a breakpoint and you can debug your node process!. In this case perhaps a complex webpack-dev-server config (like me). 馃巿

All 3 comments

Add a console.log there?

Anyway, there is a big warning when creating an issue which you have ignored:

## BEFORE YOU SUBMIT, please read the following:
If you have a support request or question please 
submit them to [StackOverflow](http://stackoverflow.com/questions/tagged/webpack) using the tag `[webpack]` or the [webpack Gitter](https://gitter.im/webpack/webpack). Future support requests will be closed.

@SpaceK33z no, I want to add a breakpoint in bypass. Not console.log

For those coming from Google ... I was trying to do this too. I also suggest following the advice above to check on stackoverflow questions (http://stackoverflow.com/questions/tagged/webpack) and add some search terms to that webpack tag. However, that doesn't really impact _the master SEO index of doom_. I arrived on this page and no README is going to change that.

Node has deprecated debug in favor of inspect. So maybe change your Google search term to _inspect_.

A way to do it is to just run node with inspect.

node --inspect node_modules/webpack-dev-server/bin/webpack-dev-server.js
Debugger listening on ws://127.0.0.1:9229 ....

It picked a default port of 9229. Great.
Then (in whatever tool or IDE) you can set breakpoints and attach. If you create a new debug run configuration it will also use a default port of 9229. Set a breakpoint and you can debug your node process!. In this case perhaps a complex webpack-dev-server config (like me). 馃巿

Was this page helpful?
0 / 5 - 0 ratings

Related issues

vzorge picture vzorge  路  3Comments

daryn-k picture daryn-k  路  3Comments

movie4 picture movie4  路  3Comments

piotrszaredko picture piotrszaredko  路  3Comments

hnqlvs picture hnqlvs  路  3Comments