Base is set in vite.config.js but is the wrong value in import.meta.env.BASE_URL

I want to have the ability to set the base URL at build time. This is more for API calls than anything else – I don’t want them going to https://localhost:7251 on production, but I also don’t want to resort to anything convoluted to swap the URLs.

I’ve a vite.config.js file that looks like this:

export default defineConfig (({ command, mode, isSsrBuild, isPreview }) => {
    const commonConfig = {
      build: {
        outDir: '../../wwwroot/dist',
        assetsDir: '',
        emptyOutDir: true,
        manifest: true,
        rollupOptions: {
          input: {
            client: './src/client.js'
          }
        },
      },
      server: {
        port: 5173,
        strictPort: true,
        hmr: {
          clientPort: 5173
        }
      },
      plugins: [
        vue(),
        VueDevTools(),
      ],
      resolve: {
        alias: {
          '@': fileURLToPath(new URL('./src', import.meta.url))
        }
      }
    };

    let envConfig = {};
    if (command === 'serve') { // configure dev, serve is an alias of 'dev'
      envConfig = {
          base: 'https://localhost:7251/'
      };
    } else if (command === 'build') {
      envConfig = {
          // production URL
      };
    }

    return Object.assign(commonConfig, envConfig);
  }
)

According to the Vite docs, if I set the value of ‘base’ in vite.config.js, this will be available as import.meta.env.BASE_URL in the application. Yet everywhere I reference it in the application, the value is / and not https://localhost:7251.

I’m not sure what to try here. I found in the vue docs mention of a define property that supposedly nests env vars, but using it just gave me CORS errors on some new .mjs file.