Subject: What's the problem?
Author: WebSpider
In response to: Why do you need Webpack?
Posted on: 04/22/2021 10:42:01 PM
Let's take a look at the dependence problem:
[+] hello-wo-webpack
|.. [+] src
|....... game.js
|....... main.js
|.. [+] public
|....... index.html
|....... style.css
game.js:
let numTimesClicked = 0;
function win() {
alert('You win!');
reset();
}
function reset() {
numTimesClicked = 0;
}
function click() {
numTimesClicked++;
console.log(`You've been clicked!`);
if (numTimesClicked === 3)
win();
}
main.js
const button = document.getElementById('button');
button.addEventListener('click', function() {
click();
});
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<!-- 'defer' should be present, otherwise Uncaught TypeError -->
<script src="../src/main.js"></script>
<script src="../src/game.js"></script>
</head>
<body>
<button id="button">Click Me!</button>
</body>
</html>
Here,
main.js depends on
game.js for click function which is not available -- resulting in Uncaught TypeError.
>
> On 04/22/2021 10:40:03 PM
WebSpider wrote:
Dependence mess
Too many files
References: