Theo's Typesafe Cult•5d ago

Add React to .NET Api

I have written a .NET Api and now i want to create a web app that uses it. And i want to set it up that the .Net server serves that app on the / route (or better any out that's not /api/*). There is some info from microsoft but that almos exclusively to creating a new combined empty project with an VisualStudio template, but i don't want a new empty .NET app and i don't have VS.

Solution:

Serve Files from wwwroot folder ```C# var builder = WebApplication.CreateBuilder(args); ... var app = builder.Build();...

Jump to solution

4 Replies

Bored StudentOP•5d ago

I've done something similar in the past using nginx but i want to have it more contained this time.

Solution

Bored Student•5d ago

Serve Files from wwwroot folder

C#
var builder = WebApplication.CreateBuilder(args);
...
var app = builder.Build();
...
app.UseStaticFiles();
app.UseDefaultFiles();
    app.MapFallbackToFile("index.html");

C#
var builder = WebApplication.CreateBuilder(args);
...
var app = builder.Build();
...
app.UseStaticFiles();
app.UseDefaultFiles();
    app.MapFallbackToFile("index.html");

Tell Vite to build to wwwroot folder:

export default defineConfig({
  plugins: [react()],
  build: {
    outDir: '../API/wwwroot',
    emptyOutDir: true,
  },
});

export default defineConfig({
  plugins: [react()],
  build: {
    outDir: '../API/wwwroot',
    emptyOutDir: true,
  },
});

Add Vite Build to Project Build & Lauch Settings

Bored StudentOP•5d ago

Bored StudentOP•5d ago

Gaming

Programming

Add React to .NET Api