Setting Vite Environment API future flag in react-router config prevents react-router server handler from being generated

[jimmend]

Describe the bug
The plugin does not currently support the Vite Environment API build model. So, when the future flag for the Vite Environment API build model is set to "true" the site does not properly deploy on netlify.

To Reproduce

1. Go to the site's react-router.config.ts file.
2. Set the config's future >> v8_viteEnvironmentApi value to true. For example:

{
...
  future: {
    v8_viteEnvironmentApi: true,
  }

3. Deploy the site to Netlify.
4. Navigate to the site.
5. The site will throw a 404 error because the react-router server handler function is not build during deployment.

Expected behavior

During deployment, the react-router server handler function should be created.

Desktop (please complete the following information):

• OS: Windows
• Browser chrome
• Version 148.0.7778.97

Additional context
Per Copilot, the issue occurs because the flag changes how Vite runs the SSR build from the old "isSsrBuild" model to the new Environment API model. The Netlify plugin checks isSsrBuild === true to know it should inject its server.js entry point, so that check is never triggered under the new model.

It seems this will definitly need to be addressed before react-router moves to version 8. Currently, the workaround is to set the v8_viteEnvironmentApi flag to false, which will not be possible in v8.

[serhalp]

Thank you @jimmend! We hadn't gotten around to trying that experimental flag yet. It's very good to know it isn't working out of the box. We'll take a look. :)

[AviVahl]

We've looked into the issue from our end.

Investigation results:

The config hook of vite-plugin-netlify-react-router gets isSsrBuild === false
Instead, there's a _config.environments?.ssr environment set up.

If we adjust that enviroment's "build" field the same way the current code changes _config.build, we see that it works.
We are also using vite@8, which uses rolldown instead of rollup, so we've had to use _config.environments?.ssr.build?.rolldownOptions?.input instead of rollupOptions.

hacked-in patch

diff --git a/packages/vite-plugin-react-router/src/plugin.ts b/packages/vite-plugin-react-router/src/plugin.ts
index ebdbf36..32d6099 100644
--- a/packages/vite-plugin-react-router/src/plugin.ts
+++ b/packages/vite-plugin-react-router/src/plugin.ts
@@ -131,7 +131,8 @@ export function netlifyPlugin(options: NetlifyPluginOptions = {}): Plugin {
     name: 'vite-plugin-netlify-react-router',
     config(_config, { command, isSsrBuild }) {
       currentCommand = command
-      isProductionSsrBuild = isSsrBuild === true && command === 'build'
+      const ssrEnviroment = _config.environments?.ssr
+      isProductionSsrBuild = (isSsrBuild === true || !!ssrEnviroment) && command === 'build'
 
       if (isProductionSsrBuild) {
         // Server bundle entry for our own server entry point (which is imported by our Netlify
@@ -140,6 +141,31 @@ export function netlifyPlugin(options: NetlifyPluginOptions = {}): Plugin {
         const functionHandlerInput = {
           [FUNCTION_HANDLER_CHUNK]: FUNCTION_HANDLER_MODULE_ID,
         }
+
+        if (ssrEnviroment) {
+          const mergedInput = mergeRollupInput(ssrEnviroment.build?.rolldownOptions?.input, functionHandlerInput)
+          const configChanges = {
+            environments: {
+              ..._config.environments,
+              ssr: {
+                ...ssrEnviroment,
+                build: {
+                  ...ssrEnviroment.build,
+                  rolldownOptions: {
+                    input: mergedInput,
+                    output: {
+                      // NOTE: must use function syntax here to work around Shopify CLI reading
+                      // the config value literally (i.e. trying to stat `[name].js` as a filename).
+                      entryFileNames: () => '[name].js',
+                    },
+                  },
+                },
+              },
+            },
+          }
+          return configChanges
+        }
+
         // We use `mergeRollupInput` because Vite (even with `mergeConfig`) doesn't handle
         // cross-type merging for `rollupOptions.input` (string/array/object).
         const mergedInput = mergeRollupInput(_config.build?.rollupOptions?.input, functionHandlerInput)

Above code needs to be nicer, not assume rolldown, reuse functions, not ignore the edge flow, etc... so this is very raw, but may give you a sense of what needs to be changed.