Skip to content

Instantly share code, notes, and snippets.

@jerryasher
Last active September 29, 2020 18:30
Show Gist options
  • Save jerryasher/e46e6dd996dfed8ad221ddd430539cdc to your computer and use it in GitHub Desktop.
Save jerryasher/e46e6dd996dfed8ad221ddd430539cdc to your computer and use it in GitHub Desktop.
How to get a create-react-app to open a different browser

I typically use Chrome for everything so my daily Chrome is larded with tons of extensions that may not play well with developing web applications. One example is they often litter the console log with various log messages of their own, or error messages with permissions problems and things like that

So I like to develop web apps in a clean vanilla copy of Chrome Canary or Chrome Beta.

Because of how create-react-app works, it seems as if there is no clear, or easy way to specify the use of a different browser in package.json

Digging into the scripts, it seems you can specify the browser you prefer by setting the BROWSER environment variable in the command line yarn start, that environment variable can be an absolute path or just the application name itself.

So here's how to do that when using WSL2 on Windows 10 and wanting to bring up Windows Chrome Beta pointing at your web app running in WSL2

browser command line
Chrome Beta env BROWSER="/mnt/c/Program Files/Google/Chrome Beta/Application/chrome.exe" yarn start
msedge env BROWSER='msedge' yarn start
beta env BROWSER='beta' yarn start
brave env BROWSER='brave' yarn start
firefox env BROWSER='firefox' yarn start

See also the official docs here: https://create-react-app.dev/docs/advanced-configuration for more ways to configure webpack through environmental variables

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment