In a typical web app, I work with three environments: local (development), sandbox, and production.

Each environment can have its own unique settings. For example, we might use different API endpoints for testing (local and sandbox) and production.

To handle this, we can configure different environment variables for each environment, as explained in my previous post: Organizing environment variables in Astro projects.

Then, to build a sandbox version of the Astro project that uses the correct environment variables, I add the following build-sandbox command to the scripts section in package.json:

"build-sandbox": "astro build --mode sandbox"

I also rename the build command to build-production for clarity.

The scripts section then looks something like this:

"scripts": {
	"build-production": "astro build",
	"build-sandbox": "astro build --mode sandbox"

With this setup, running npm run build-production generates a production version, while npm run build-sandbox creates a sandbox version.