I have a R3F application that I am trying to add a favicon to. I am familiar with coding in React.js and how to add a favicon there, but have so far been unsuccessful in doing so with R3F. Here is my code for index.html file:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Elias Lind</title>
</head>
<body>
<div id="root"></div>
<script type="module" src="./index.jsx"></script>
</body>
</html>
I have tried adding the following line:
<link rel="icon" href="./favicon.ico" type="image/x-icon">
but that did not do anything (I also tried having the type be “icon”). My file structure is as follows:
/.vercel
./node_modules
./public
./src
./static
The HTML file is in the src folder and the favicon.ico file has a copy in the src, root, and public folders