Update handlebars template imports for deploying

public/components/AuthForm/AuthForm.js

@@ -1,5 +1,7 @@
 import { goToPage } from '../..';
 import { apiClient } from '../../modules/ApiClient';
+import template from './AuthForm.hbs';
+
 import {
   validateEmailAddress,
   validatePassword,
@@ -78,7 +80,6 @@ export class AuthForm {
   }
 
   renderTemplate() {
-    const template = Handlebars.templates['AuthForm.hbs'];
     this.#parent.innerHTML = template();
   }
 }

public/components/Card/Card.js

@@ -1,3 +1,5 @@
+import template from './Card.hbs';
+
 export class Card {
   #parent;
   #movie;
@@ -12,10 +14,9 @@ export class Card {
   }
 
   renderTemplate() {
-    const template = Handlebars.templates['Card.hbs'];
     this.#parent.insertAdjacentHTML(
       'beforeend',
-      template({ movie: this.#movie })
+      template({ movie: this.#movie }),
     );
   }
 }

public/components/CardsList/CardsList.js

@@ -1,4 +1,5 @@
 import { Card } from '../Card/Card';
+import template from './CardsList.hbs';
 
 export class CardsList {
   #parent;
@@ -16,8 +17,6 @@ export class CardsList {
   }
 
   renderTemplate() {
-    const template = Handlebars.templates['CardsList.hbs'];
-
     this.#parent.insertAdjacentHTML('beforeend', template({ id: this.#id }));
 
     const cardsList = document.getElementById(`cards-list-${this.#id}`);

public/components/ConfirmModal/ConfirmModal.js

@@ -1,3 +1,5 @@
+import template from './ConfirmModal.hbs';
+
 export class ConfirmModal {
   #text;
   #onConfirm;
@@ -10,7 +12,6 @@ export class ConfirmModal {
   }
 
   render() {
-    const template = Handlebars.templates['ConfirmModal.hbs'];
     const root = document.getElementById('root');
     root.insertAdjacentHTML('beforeend', template({ text: this.#text }));
     root.style.overflow = 'hidden';

public/components/GridBlock/GridBlock.js

@@ -1,4 +1,5 @@
 import { CategoryPage } from '../../pages/CategoryPage/CategoryPage';
+import template from './GridBlock.hbs';
 
 export class GridBlock {
   #parent;
@@ -31,7 +32,6 @@ export class GridBlock {
   }
 
   renderTemplate() {
-    const template = Handlebars.templates['GridBlock.hbs'];
     this.#parent.innerHTML = template({
       items: this.getTop(),
       title: this.#blockTitle,

public/components/Header/Header.js

@@ -1,3 +1,5 @@
+import template from './Header.hbs';
+
 export class Header {
   #parent;
   #config;
@@ -25,7 +27,6 @@ export class Header {
   }
 
   renderTemplate() {
-    const template = Handlebars.templates['Header.hbs'];
     const items = this.items.map(([key, { text, href }], index) => {
       let className = '';
       if (index === 0) {

public/components/Loader/Loader.js

@@ -1,3 +1,5 @@
+import template from './Loader.hbs';
+
 export class Loader {
   // parent нужен для того, чтобы понимать где отображать лоадер
   #parent;
@@ -10,7 +12,6 @@ export class Loader {
   }
 
   render() {
-    const template = Handlebars.templates['Loader.hbs'];
     this.#parent.innerHTML = template();
   }
 

public/components/RegForm/RegForm.js

@@ -1,5 +1,6 @@
 import { goToPage } from '../..';
 import { apiClient } from '../../modules/ApiClient';
+import template from './RegForm.hbs';
 
 import {
   validateEmailAddress,
@@ -119,7 +120,6 @@ export class RegForm {
   }
 
   renderTemplate() {
-    const template = Handlebars.templates['RegForm.hbs'];
     this.#parent.innerHTML = template();
   }
 }

public/components/Slider/Slider.js

@@ -1,4 +1,5 @@
 import { Card } from '../Card/Card';
+import template from './Slider.hbs';
 
 export class Slider {
   #parent;
@@ -37,8 +38,6 @@ export class Slider {
   }
 
   renderTemplate() {
-    const template = Handlebars.templates['Slider.hbs'];
-
     this.#parent.insertAdjacentHTML('beforeend', template({ id: this.#id }));
 
     const container = document.querySelector('.slider__container');

public/pages/AuthPage/AuthPage.js

@@ -1,4 +1,5 @@
 import { AuthForm } from '../../components/AuthForm/AuthForm';
+import template from './AuthPage.hbs';
 
 export class AuthPage {
   #parent;
@@ -16,7 +17,6 @@ export class AuthPage {
     rootElem.classList.remove('root-black');
     rootElem.classList.add('root-image');
 
-    const template = Handlebars.templates['AuthPage.hbs'];
     this.#parent.innerHTML = template();
 
     const authForm = document.getElementById('auth-page-form-block');

public/pages/CategoryPage/CategoryPage.js

@@ -1,6 +1,7 @@
 import { CardsList } from '../../components/CardsList/CardsList';
 import { apiClient } from '../../modules/ApiClient';
 import { MainPage } from '../MainPage/MainPage';
+import template from './CategoryPage.hbs';
 
 export class CategoryPage {
   #parent;
@@ -43,7 +44,6 @@ export class CategoryPage {
   }
 
   renderTemplate() {
-    const template = Handlebars.templates['CategoryPage.hbs'];
     this.#parent.innerHTML = template({
       title: this.#pageTitle,
     });

public/pages/MainPage/MainPage.js

@@ -3,6 +3,7 @@ import { CardsList } from '../../components/CardsList/CardsList';
 import { GridBlock } from '../../components/GridBlock/GridBlock';
 import { Slider } from '../../components/Slider/Slider';
 import { Loader } from '../../components/Loader/Loader';
+import template from './MainPage.hbs';
 
 import bb from '../../assets/mockImages/bb2.jpg';
 import mh from '../../assets/mockImages/mh.jpg';
@@ -95,7 +96,6 @@ export class MainPage {
     rootElem.classList.add('root-black');
     rootElem.classList.remove('root-image');
 
-    const template = Handlebars.templates['MainPage.hbs'];
     this.#parent.innerHTML = template();
 
     this.#loader = new Loader(this.#parent, template());

public/pages/RegPage/RegPage.js

@@ -1,4 +1,5 @@
 import { RegForm } from '../../components/RegForm/RegForm';
+import template from './RegPage.hbs';
 
 export class RegPage {
   #parent;
@@ -16,7 +17,6 @@ export class RegPage {
     rootElem.classList.remove('root-black');
     rootElem.classList.add('root-image');
 
-    const template = Handlebars.templates['RegPage.hbs'];
     this.#parent.innerHTML = template();
 
     const regForm = document.getElementById('reg-page-form-block');