mpen
mpen

Reputation: 283053

How to detect if webpack-dev-server is running?

How can I determine if webpack.config.js was loaded via webpack vs webpack-dev-server?

Upvotes: 36

Views: 16483

Answers (6)

user326608
user326608

Reputation: 2548

this worked for me in an old-school js app:

// <your_app_id> i think comes from your package.json; ymmv
const isDevServer = window.webpackHotUpdate_<your_app_id>;
if (isDevServer) { 
    // return etc        
}
// not in webpack/wds (prod mode)
// ...

Upvotes: 1

In general, webpack-dev-server runs with mode='development' (https://webpack.js.org/configuration/mode/#root), while webpack runs with mode=production. If so, you can use the value of:

process.env.NODE_ENV

Upvotes: -1

Martin Barksten
Martin Barksten

Reputation: 455

Update: The environment variable is changed to WEBPACK_SERVE.

The webpack dev server will now set the WEBPACK_DEV_SERVER environment variable, allowing for a more robust way to check.

const isDevServer = process.env.WEBPACK_DEV_SERVER;

Upvotes: 32

bjfletcher
bjfletcher

Reputation: 11518

Either:

const isDevServer = process.argv[1].indexOf('webpack-dev-server') !== -1;

or:

const isDevServer = process.argv.some(v => v.indexOf('webpack-dev-server') !== -1);

or:

const isDevServer = process.argv.some(v => v.includes('webpack-dev-server'));

I've been using the latter to a great effect. One configuration FTW!

Upvotes: 19

Guillaume
Guillaume

Reputation: 129

Or use the Webpack Environment Variables:

// The webpack command line
webpack-dev-server --open --env.devServer

// webpack.config.js
module.exports = env => {
  console.log('isDevServer: ', env.devServer) // true
  ...
}

Upvotes: 7

mpen
mpen

Reputation: 283053

I found one potential soluton:

var isDevServer = path.basename(require.main.filename) === 'webpack-dev-server.js';

credit

Upvotes: 7

Related Questions