Parcel changes file names used in template literals

53 views Asked by At

I'm developing a memory game with JavaScript. I've decided to create tiles by injection of HTML code by template literals. Problem arises when Parcel modifies file names that have been referenced by function responsible for injecting HTML code.

I'm getting file like this for example: tile-1.188b0892, instead of tile-1. I've got 20 tile files and I'm connecting tile number to randomly generated image.

How to solve this problem?

function createBoard(tilesNum, difficulty) {
  newBoard && newBoard.remove();
  // creatng desired board
  newBoard = document.createElement("div");
  mainBoard.appendChild(newBoard);
  newBoard.classList.add(`board-${difficulty}`);
  // filling board with tiles
  for (let i = 0; i < tilesNum; i++) {
    const randomNum = Math.floor(Math.random() * 20 + 1);
    console.log(randomNum);
    const tile = `
        <div class="tile__container">
            <div class="tile">
            <div class="tile--front" ></div>
            <div class="tile--back" style="background-image: url('/src/assets/tile-${randomNum}.svg')"></div>
            </div>
        </div>`;
    newBoard.insertAdjacentHTML("afterbegin", tile);
  }
}
0

There are 0 answers