Issues using V1 Route Convention with Remix vite plugin

[aland-dev]

Hello there,

I'm trying to get V1 route convention to work with the new vite plugin but got the below error. Is this a remix issue or am I doing something wrong?

Here is the a the reproduction environment: https://stackblitz.com/edit/remix-vite-v1-routes

Error: No route matches URL "/example/new"
    at getInternalRouterError (/home/projects/remix-vite-v1-routes/node_modules/@remix-run/router/router.ts:4483:5)
    at Object.query (/home/projects/remix-vite-v1-routes/node_modules/@remix-run/router/router.ts:2933:19)
    at handleDocumentRequestRR (/home/projects/remix-vite-v1-routes/node_modules/@remix-run/server-runtime/dist/server.js:180:35)
    at requestHandler (/home/projects/remix-vite-v1-routes/node_modules/@remix-run/server-runtime/dist/server.js:105:24)
    at eval (/home/projects/remix-vite-v1-routes/node_modules/@remix-run/express/dist/server.js:41:22)
No routes matched location "/example/new" 
ErrorResponseImpl {
  status: 404,
  statusText: 'Not Found',
  internal: true,
  data: 'Error: No route matches URL "/example/new"',
  error: Error: No route matches URL "/example/new"
      at getInternalRouterError (/home/projects/remix-vite-v1-routes/node_modules/@remix-run/router/router.ts:4483:5)
      at Object.query (/home/projects/remix-vite-v1-routes/node_modules/@remix-run/router/router.ts:2933:19)
      at handleDocumentRequestRR (/home/projects/remix-vite-v1-routes/node_modules/@remix-run/server-runtime/dist/server.js:180:35)
      at requestHandler (/home/projects/remix-vite-v1-routes/node_modules/@remix-run/server-runtime/dist/server.js:105:24)
      at eval (/home/projects/remix-vite-v1-routes/node_modules/@remix-run/express/dist/server.js:41:22)
}

[kiliman]

Change ignoredRouteFiles to ignore all files. Remove the dot in the pattern. Otherwise Remix is processing the routes using the v2 convention.

[aland-dev]

Thank you for your answer, but it does not seem to work even with the dot remove in the pattern.

[hi-ogawa]

I'm trying to get V1 route convention to work with the new vite plugin

It looks like you're not using Vite actually. Instead of remix dev and remix build, the scripts should look like this:

remix/templates/unstable-vite/package.json

Lines 6 to 7 in 36ccae4

	"build": "remix vite:build",
	"dev": "remix vite:dev",

Could you try starting from the official template? https://github.com/remix-run/remix/tree/main/templates/unstable-vite

[aland-dev]

Thanks indeed, https://remix.run/docs/en/main/future/vite#migrating-from-remix-app-server they've been updated recently 👍

[Nedi11]

Has been there for 2 months https://github.com/remix-run/remix/blob/7ed944abda9368cbff6c4871802e50d0f89be699/docs/future/vite.md

[aland-dev]

need goggles

[ridoybevy]

tailwind css not working

[aland-dev]

https://remix.run/docs/en/main/future/vite#enable-tailwind-via-postcss

[hassankhanmv]

heres the complete answer, we are struggling too to create folder based routing,
first run this command
npm i -D @remix-run/v1-route-convention
and update your vite.config.js

add this line in remix({

        // uses the v1 convention, works in v1.15+ and v2
        return createRoutesFromFolders(defineRoutes);
      },

my vite.config.js file lloks like this after updating it

import { vitePlugin as remix } from "@remix-run/dev";
import { defineConfig } from "vite";
import tsconfigPaths from "vite-tsconfig-paths";
import {
  createRoutesFromFolders,
} from "@remix-run/v1-route-convention";

export default defineConfig({
  plugins: [
    remix({
      routes(defineRoutes) {
        // uses the v1 convention, works in v1.15+ and v2
        return createRoutesFromFolders(defineRoutes);
      },
      future: {
        v3_fetcherPersist: true,
        v3_relativeSplatPath: true,
        v3_throwAbortReason: true,
        v3_errorBoundary: true,
        v3_meta: true,
        v3_normalizeFormMethod: true,
        v3_routeConvention: false,
      },
    },
  ),
    tsconfigPaths(),
  ],
  
});

root directory
app/routes/inbound/inbound.jsx
now i can access my folders nested routes after this.

Best Regards
Eilmi | eilmi.com