feat(@react-router/dev): log future flag warnings for upcoming v8 flags

integration/cli-test.ts

@@ -112,7 +112,17 @@ test.describe("cli", () => {
   test("routes", async () => {
     const cwd = await createProject();
     let { stdout, stderr, status } = run(["routes"], { cwd });
-    expect(stdout.toString().trim()).toBe(dedent`
+
+    // Filter out future flag warnings for the format:
+    // ⚠️  Future Flag Warning: Route module splitting behavior is changing in React Router v8.
+    //     You can use the `future.v8_splitRouteModules` flag to opt in early.
+    //     -> https://reactrouter.com/upgrading/future-flags#v8_splitRouteModules
+    let filteredStdOut = stdout.toString().split("\n");
+    while (filteredStdOut[0]?.includes("Future Flag Warning:")) {
+      filteredStdOut.splice(0, 3);
+    }
+
+    expect(filteredStdOut.join("\n").trim()).toBe(dedent`
       <Routes>
         <Route file="root.tsx">
           <Route index file="routes/_index.tsx" />

packages/react-router-dev/.changes/minor.v8-future-flag-warnings.md

@@ -0,0 +1,3 @@
+Log future flag warnings for upcoming React Router v8 flags
+
+- `v8_middleware`, `v8_splitRouteModules`, `v8_viteEnvironmentApi`, `v8_passThroughRequests`

packages/react-router-dev/__tests__/future-flags-test.ts

@@ -0,0 +1,57 @@
+import { logFutureFlagWarnings } from "../config/config";
+
+describe("logFutureFlagWarnings", () => {
+  let logSpy: jest.SpyInstance;
+
+  beforeEach(() => {
+    logSpy = jest.spyOn(console, "log").mockImplementation(() => {});
+  });
+
+  afterEach(() => {
+    logSpy.mockRestore();
+  });
+
+  it("warns about all stable v8_ flags when none are set", () => {
+    logFutureFlagWarnings({});
+
+    expect(logSpy).toHaveBeenCalledTimes(4);
+    expect(logSpy.mock.calls[0][0]).toContain("v8_middleware");
+    expect(logSpy.mock.calls[1][0]).toContain("v8_splitRouteModules");
+    expect(logSpy.mock.calls[2][0]).toContain("v8_viteEnvironmentApi");
+    expect(logSpy.mock.calls[3][0]).toContain("v8_passThroughRequests");
+  });
+
+  it("does not warn about flags that are already opted in (true)", () => {
+    logFutureFlagWarnings({
+      v8_middleware: true,
+      v8_splitRouteModules: true,
+      v8_viteEnvironmentApi: true,
+      v8_passThroughRequests: true,
+    });
+
+    expect(logSpy).not.toHaveBeenCalled();
+  });
+
+  it("does not warn about flags that are explicitly opted out (false)", () => {
+    logFutureFlagWarnings({
+      v8_middleware: false,
+      v8_splitRouteModules: false,
+      v8_viteEnvironmentApi: false,
+      v8_passThroughRequests: false,
+    });
+
+    expect(logSpy).not.toHaveBeenCalled();
+  });
+
+  it("only warns about flags that are not yet set", () => {
+    logFutureFlagWarnings({
+      v8_middleware: true,
+      v8_passThroughRequests: false,
+    });
+
+    // Only v8_splitRouteModules and v8_viteEnvironmentApi are missing
+    expect(logSpy).toHaveBeenCalledTimes(2);
+    expect(logSpy.mock.calls[0][0]).toContain("v8_splitRouteModules");
+    expect(logSpy.mock.calls[1][0]).toContain("v8_viteEnvironmentApi");
+  });
+});

packages/react-router-dev/config/config.ts

@@ -753,9 +753,48 @@ async function resolveConfig({
     await preset.reactRouterConfigResolved?.({ reactRouterConfig });
   }
 
+  logFutureFlagWarnings(userAndPresetConfigs.future || {});
+
   return ok(reactRouterConfig);
 }
 
+function logFutureFlagWarning(flag: string, message: string): void {
+  console.log(
+    colors.yellow(
+      `  ⚠️  Future Flag Warning: ${message}\n` +
+        `     You can use the \`future.${flag}\` flag to opt in early.\n` +
+        `     -> https://reactrouter.com/upgrading/future-flags#${flag}`,
+    ),
+  );
+}
+
+export function logFutureFlagWarnings(future: Partial<FutureConfig>): void {
+  if (future.v8_middleware === undefined) {
+    logFutureFlagWarning(
+      "v8_middleware",
+      "Route middleware support is changing in React Router v8.",
+    );
+  }
+  if (future.v8_splitRouteModules === undefined) {
+    logFutureFlagWarning(
+      "v8_splitRouteModules",
+      "Route module splitting behavior is changing in React Router v8.",
+    );
+  }
+  if (future.v8_viteEnvironmentApi === undefined) {
+    logFutureFlagWarning(
+      "v8_viteEnvironmentApi",
+      "Vite Environment API usage is changing in React Router v8.",
+    );
+  }
+  if (future.v8_passThroughRequests === undefined) {
+    logFutureFlagWarning(
+      "v8_passThroughRequests",
+      "Request handling behavior is changing in React Router v8.",
+    );
+  }
+}
+
 type ChokidarEventName = ChokidarEmitArgs[0];
 
 type ChangeHandler = (args: {