How to load index.html in FastAPI

Viewed 1092

I built my app in Vue and my backend using FastAPI in Python. After I did npm run build I copied the dist folder into the templates folder. I want to load index.html but I got the error error_aborted 404 (not found). The static folder is inside templates folder. Why am I getting this error?

from fastapi.staticfiles import StaticFiles
from fastapi.templating import Jinja2Templates

app = FastAPI()

templates = Jinja2Templates(directory="templates")
app.mount("/static", StaticFiles(directory="templates"))

@app.get("/")
def serve_home(request: Request):
    return templates.TemplateResponse("index.html", context= {"request": request})

I also tried the following code, and putting the dist folder in the static folder with no templates folder.

@app.get("/")
async def index():
    return FileResponse('static/index.html', media_type='text/html')
1 Answers

replace this:

app.mount("/static", StaticFiles(directory="templates"))

with this:

app.mount("/", StaticFiles(directory="templates"))
Related