Allow special characters in path and filenames

[Kingdutch]

Background

Next.js is the defacto solution for creating dynamic React.js websites. It allows to easily create applications and fine-tune where rendering happens (client or server). ReScript would be a great match here to provide typesafety in these solutions. Some great work has been done by https://github.com/mrmurphy/reason-nextjs already but a large painpoint remains.

Next.js uses special characters such as [id] and [...slug] in the pathnames and filenames of files in the pages/ directory. These are variable placeholders that are used for route arguments. Documentation for this can be found here: https://nextjs.org/docs/routing/dynamic-routes

Requested change

By allowing special characters (specifically those used by Next.js routing) in path and filenames, integration with the Next.js framework would be greatly simplified. This could be put behind configuration that limits it to a specific folder that may not be used as module imports (to work around the module naming limitation).

[bobzhang]

note we currently support something like this

[@@@bs.config { no_export} ]

if we add a payload in no_export to change filename, would that be enough?

[@@@bs.config { no_export = "123"} ]

It will generate "123.js"

[Kingdutch]

Ooh interesting! Does this prevent Reason exports only? There are exports required in the JavaScript code for the page components

[bobzhang]

hi @Kingdutch we will relax the name a little bit to allow, 404.ml.
We need some more input that which names are desired to be allowed
Note that you still can not access it due to syntax restriction.

[bobzhang]

see #4685

[Kingdutch]

Thanks @bobzhang I think allowing numbers is a cool first step. It mostly helps with error pages (404, 500, etc.) :D

The game-changer here would still be adding support for [, ], and . though so that URL arguments can be specified :D

Not being able to access these modules is fine as you're not supposed to access Next.js or Page components from other files anyway.

[bobzhang]

#1436 we could also support Button.Android.res
Where could I find file names using [,]?

[Kingdutch]

@bobzhang you can see in the Next.js Dynamic Routes documentation how they use [, ], and . in the filename and then map this to arguments in the URL and query parameters in the component.

The current Next.js bindings recommend using symlinks to get the correct filename. However, this is not a great experience when working with git or deploying to platforms where it's uncertain if symlinks are available. So allowing the caracters []. in a ReScript filename would mean we can work without symlinks and use the BuckleScript output directly.

[bobzhang]

Would you make a list of files so that I can add it to tests Alexander Varwijk <notifications@github.com>于2020年9月11日 周五上午1:22写道：

@bobzhang <https://github.com/bobzhang> you can see in the Next.js Dynamic Routes <https://nextjs.org/docs/routing/dynamic-routes> documentation how they use [, ], and . in the filename and then map this to arguments in the URL and query parameters in the component. The current Next.js bindings recommend using symlinks <https://github.com/mrmurphy/reason-nextjs#the-basics> to get the correct filename. However, this is not a great experience when working with git or deploying to platforms where it's uncertain if symlinks are available. So allowing the caracters []. in a ReScript filename would mean we can work without symlinks and use the BuckleScript output directly. — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub <#4624 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AAFWMK2IOKPJVXUX6NKKXCLSFEDNHANCNFSM4P7IGM4A> . --

Regards -- Hongbo Zhang

[supriyo]

@bobzhang Here is a list of file name examples to support that would make working with nextjs easier:

404.res
_app.res
[slug_or_ID].res    
[...params].res 
[...params_max_3].res
[[...params]].res 

[bobzhang]

@supriyo can you check if #4690 covers all your cases
Note this is experimental, we may apply restrictions back if there are some conflicts we don't recognize yet

[Kingdutch]

@bobzhang From reading the PR it looks good to me. I don't have a ReScript Next.js repository nearby to test the individual files unfortunately. I could do so later this week.

[supriyo]

@bobzhang That looks good to me too. This is will be really helpful. Thanks!

[bobzhang]

experimental support landed in master