index.html이 어떻게 main.js에 적용되는건가요?

index.html 파일이 어떻게 app.vue와 연결되어 적용되는건지 궁금합니다. 또 head 부분을 이런식으로 작성했는데 글씨체 적용이 안되는데 뭐가 문제일까요

  <meta charset="UTF-8">
    <title>TODO</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="shorcut icon" href="src/assets/favicon.ico" type="image/x-icon">
    <link rel="icon" href="src/assets/favicon.ico" type="image/x-icon"> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/js/v4-shims.min.js" integrity="sha512-1ND726aZWs77iIUxmOoCUGluOmCT9apImcOVOcDCOSVAUxk3ZSJcuGsHoJ+i4wIOhXieZZx6rY9s6i5xEy1RPg==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Ubuntu" rel="stylesheet">

인프런 커뮤니티 질문&답변