Porting vite.config.js to Perla

[DejanMilicic]

I am attempting to port vite configuration to Perla. My project is a Sutil with both Client and Server projects. I got Client project working.

Now I need to direct API calls to Server. Hence, I need to port this

    proxy: {
        // Redirect requests that start with /api/ to the server on port 8085
        '/api/': {
            target: 'http://localhost:8085',
            changeOrigin: true
        },
        // redirect websocket requests that start with /socket/ to the server on the port 8085
        '/socket/': {
            target: 'http://localhost:8085',
            ws: true
        }        
    }

to Perla configuration. I looked at the options, but I was unable to find suitable one.

[AngelMunoz]

Hey! Hello there For this case you want to create a proxy-config.json file next to the perla.jsonc file here's the docs page about it https://perla-docs.web.app/#/docs/features/dev-proxy

In your case I think it will be something along these lines

{
 "/api/{**catch-all}": "http://localhost:8085",
 "/socket/{**catch-all}": "http://localhost:8085"
}

EDIT: fixed a missing slash

-"/socket{**catch-all}": "http://localhost:8085"
+"/socket/{**catch-all}": "http://localhost:8085"

It uses the same syntax as the aspnet routing template urls so you can customize that up to some extent

Perla internally uses YARP to do the dev proxy so it should work, what I'm not sure if it'll work properly is the web sockets (I guess it should from briefly looking at the YARP docs) let me know how that goes

[DejanMilicic]

Thank you. This is helpful - I do not know how I managed to miss this in the documentation (maybe current menu item selection would be beneficial?)

I added file with suggested content, and now I am getting

Perla: Checking whether esbuild is present...
Perla: esbuild is present.
Perla:Serve: Starting Dev Server
Perla:Serve: Starting Fable
Unhandled exception. Microsoft.AspNetCore.Routing.Patterns.RoutePatternException: A path segment that contains more than one section, such as a literal section or a parameter, cannot contain a catch-all parameter.
   at Microsoft.AspNetCore.Routing.Patterns.RoutePatternParser.Parse(String pattern)
   at Microsoft.AspNetCore.Routing.Patterns.RoutePatternFactory.Parse(String pattern)
   at Perla.Lib.Server.devServer@682-9.Invoke(IEndpointRouteBuilder endpoints) in /Users/tuna/repos/Perla/src/Perla.Lib/Server.fs:line 687
   at Microsoft.AspNetCore.Builder.EndpointRoutingApplicationBuilderExtensions.UseEndpoints(IApplicationBuilder builder, Action`1 configure)
   at Perla.Lib.Server.devServer(PerlaConfig config) in /Users/tuna/repos/Perla/src/Perla.Lib/Server.fs:line 680
   at Perla.Lib.Server.startServer(PerlaConfig config) in /Users/tuna/repos/Perla/src/Perla.Lib/Server.fs:line 706
   at Perla.Lib.Server.serverActions@724-1.Invoke(Unit unitVar) in /Users/tuna/repos/Perla/src/Perla.Lib/Server.fs:line 725
   at Microsoft.FSharp.Control.AsyncPrimitives.CallThenInvoke[T,TResult](AsyncActivation`1 ctxt, TResult result1, FSharpFunc`2 part2) in D:\a\_work\1\s\src\FSharp.Core\async.fs:line 508
   at Microsoft.FSharp.Control.Trampoline.Execute(FSharpFunc`2 firstAction) in D:\a\_work\1\s\src\FSharp.Core\async.fs:line 112
--- End of stack trace from previous location ---

Any suggestions?

[AngelMunoz]

Hmm, my example is missing a / in the websocket endpoint so perhaps that could have been it

I have a sample with the SAFE stack here which can be helpful to run it, otherwise if you could provide me a sample project I can try to figure out the correct syntax (which I tend to forget to be honest 😅)

[DejanMilicic]

I also missed slash. Following your correction, it works fine now. Thanx for swift reaction!

I will check web sockets part and come back to you

[AngelMunoz]

Hey @DejanMilicic let me know if the websockets part worked as expected, feel free to re-open if that was not the case