Open Create-React-App In a Specific Browser
By default, Create-React-App will open your application with the default browser for your operating system when it initially starts. But what if you need to open your Create-React-App application in a specific browser on its initial start? Or what if you wanted to not open a browser at all?
Luckily, Create-React-App has a built-in way to control this. You can override the default browser setting with your own BROWSER=<name>
environment variable in the scripts section of your package.json
file.
Here is an example of what the environment variable looks like:
BROWSER=firefox
This will open your Create-React-App application in the Firefox browser when it starts up.
And it will look like this in your package.json
file as a npm start
script:
"scripts": {
"start": "BROWSER=firefox react-scripts start"
},
Now when you run your application with the npm start
command, you'll notice it opens in Firefox.
One thing to keep in mind is that each browser app name is dependent on the platform your operating system is on (macOS, Linux, Windows, etc.) and has the possibility of being different from platform to platform. Therefore, you shouldn't hard code it into your reusable modules.
For example, if you wanted to open your application using Google Chrome, the environment variable will be different depending on what operating system you're on:
- macOS:
BROWSER=google-chrome
- Linux:
BROWSER=google-chrome
- Windows:
BROWSER=chrome
Notice that the Windows environment variable is different from Linux and macOS. These small differences in names across operating systems could cause potential bugs and are something you should be aware of.
It can be annoying to have a browser window pop open everytime you start your application. So, you can also tell Create-React-App to disable the feature all together and have it not open any browser windows.
You can do this by setting the environment variable to:
BROWSER=none
And the script in your package.json
file would look like this:
"scripts": {
"start": "BROWSER=none react-scripts start"
},
When you start your application again with the npm start
command, your application won't open in any browser.
Check out the Create-React-App documentation for more configuration and environment variable options.