how to use this in vite+ react route?

[jesse996]

[mwondhaf]

In the vite.config.ts file, I put it under the vitePlugin in the plugins... see below my code

import { vitePlugin as remix } from "@remix-run/dev";
import { installGlobals } from "@remix-run/node";
import { flatRoutes } from "remix-flat-routes";
import { defineConfig } from "vite";
import tsconfigPaths from "vite-tsconfig-paths";

installGlobals();

export default defineConfig({
  plugins: [
    remix({
      ignoredRouteFiles: ["**/.*"],
      routes: async (defineRoutes) => {
        return flatRoutes("routes", defineRoutes);
      },
    }),
    tsconfigPaths(),
  ],
});

[leonardo-ornelas]

Does your CLI command show all routes?

npx remix routes

Here it shows almost nothing after updating to use vite, but routes work at runtime.

[leonardo-ornelas]

nvm, i just updated to the last remix and worked.

[kiliman]

Yes, prior to v2.8.1, the remix CLI didn't read the vite.config.ts file, so you still needed a remix.config.js file. Now you can keep everything in the Vite config.

[jesse996]

soory but i mean is it possible to use this with react router +vite , not remix +vite?

[kiliman]

@jesse996 React Router doesn't use file-based routes, so remix-flat-routes doesn't apply.