[Bug?]: rename the index.tsx file to the name of the folder always gives a 404 about solid-start HOT 5 CLOSED

The doc https://docs.solidjs.com/solid-start/building-your-application/routing#renaming-index uses socials/socials.tsx so it should be updated? I tried socials/(socials).tsx and it works.

It also does not mention about putting the folder name in brackets.

To avoid this, you can rename the index.tsx file to the name of the folder it is in and it will be rendered as the default export for that route:

from solid-start.

This is a misunderstanding I think.

routes/auth/auth.tsx produces /auth/auth

You want

routes/auth/(auth).tsx or routes/auth/index.tsx

Same name convention is around nesting layouts being the same name as a folder. Otherwise we follow the index convention. We just have it so empty is also the same index. And everything between () is removed. But like in this example it could be named whatever and be the same:

routes/auth/(whatever).tsx also produces /auth

from solid-start.

Thank you for your reply @ryansolid

Two things I like to add:

The documentation is pretty clear on how this should work (unless I really don't understand it):

Renaming Index

By default, the component that is rendered for a route comes from the default export of the index.tsx file in each folder. However, this can make it difficult to find the correct index.tsx file when searching, since there will be multiple files with that name.

To avoid this, you can rename the index.tsx file to the name of the folder it is in and it will be rendered as the default export for that route:

|-- routes/                       // example.com
    |-- blog/
        |-- article-1.tsx         // example.com/blog/article-1
        |-- article-2.tsx
    |-- work/
        |-- job-1.tsx             // example.com/work/job-1
        |-- job-2.tsx
    |-- socials/
        |-- socials.tsx           // example.com/socials <== THIS DOES NOT WORK

routes/auth/auth.tsx does **not** produces /auth/auth (also 404 not found)
routes/auth/(auth).tsx gives another error: Failed to fetch dynamically imported module

I don't want to be nitpicky, just trying things out and I really would like to avoid a lot of 'index.tsx' files all over the place.

from solid-start.

I tried @baoxdev solution and it works. How to add a layout to this?

from solid-start.

routes/auth/(whatever).tsx seems to work when rendered on the server, but client side routing is failing?

Update: It worked after a browser hard refresh. It seems that the dev server does not automatically invalidate browser cache?

from solid-start.