setting up cypress for different env when I have different baseUrl and apiUrl on all of them

so I've been setting up my tests on localhost, but now I want to set them up to run on several different environments, but on all of them I have a separate baseUrl and apiUrl.dev has: http://base.url.com and api: http://base.url.com/apiprod has: https://prod.url.com and api: https://prod-api.url.com/v1

I've read the documentation and some posts here(although a lot of them are from before cypress v10), but I can't decide what would be the best approach. I'm leaning towards creating different config files(cypress-dev.config.ts, cypress-prod.config.ts etc.), each for a different environment like so:

e2e: {   baseUrl: 'http://base.url.com',   env: {     apiURl: '..'}}

creating new npm scripts where I set cypress to use the correct config file when running on a particular environment.

I've considered using one config file, but I'm having trouble figuring out how exactly to do it.

e2e: {    env: {     development: {       baseUrl:'baseURlDev',      apiURl: 'apiUrlDev'    },    production: {      baseUrl:'baseURlProd',      apiURl: 'apiUrlProd'    },    staging: {      baseUrl:'baseURlStag'      apiURl: 'apiUrlStag'   }     }}

and how to use this is my cypress code. Cypress.env('type-of-environment.baseUrl')?? I'm not clear on this.

Or maybe there's third neat way of doing this that I haven't considered yet?