4
  • I am bundling using Webpack 4.
  • I have multiple Webpack configurations exported in webpack.config.js.
  • First configuration is to bundle lient code targeting browsers.
  • Second configuration is to bundle server code targeting node.
  • I am specifying these browsers and node targets using browserslist in package.json.

I need to specify different browserslists for client and server bundles, but I only have one browserslist key in package.json.

How can I specify different browserslists using package.json?

geeko
  • 2,649
  • 4
  • 32
  • 59

1 Answers1

0

You don't have to use package.json. If you create a file called .browserslistrc or browserslist at the root of your project, you can use a different configuration.

# Any general config goes at the very top, above any section headers
# ...

# Put section headers in [brackets]

[node]
supports es6-modules

[web]
>1% and not dead

Then call webpack and set BROWSERSLIST_ENV:

BROWSERSLIST_ENV=dev webpack -c webpack.dev.js # Build development
BROWSERSLIST_ENV=prod webpack -c webpack.prod.js # Build production

Your webpack command may be different depending on your configuration.

applemonkey496
  • 683
  • 1
  • 10
  • 29