The latest updates on your projects. Learn more aboutVercel for Git ↗︎

• ❌ login:@Hydrock / The commit (31ac66e). This user is authorized, but they must confirm their affiliation with their company. Start the authorization process by clicking here, click "Corporate", select the appropriate company from the list, then confirm your affiliation on the page that appears. For further assistance with EasyCLA,please submit a support request ticket.

Yeah, it's sort of confusing at the first sight. But how are you gonna useprintMe function defined inprint.js if you don't import it? And note that it's not exposed as a global variable in our example so you can't just callprintMe.

Here's how I would reason about it,

1. first, you write code in ESM, there's nothing special here even if you're going to use webpack to bundle your code
2. you decide to output two bundles. In webpack, one entry would only output one bundle, that's why we define two entries. The contrived example is for education purpose, so it might not be easy to reason about.

Hope it helps.

Yeah, it's sort of confusing at the first sight. But how are you gonna useprintMe function defined inprint.js if you don't import it? And note that it's not exposed as a global variable in our example so you can't just callprintMe.

Here's how I would reason about it,

1. first, you write code in ESM, there's nothing special here even if you're going to use webpack to bundle your code
2. you decide to output two bundles. In webpack, one entry would only output one bundle, that's why we define two entries. The contrived example is for education purpose, so it might not be easy to reason about.

Hope it helps.

First of all, thank you for the answer - it's very valuable.

But. This example is very strange. It is designed for beginners, but only misleads them.

Giving an example of the use of technology, an example is given in order to show the practical benefits of technology. Specifically, in this example, two bundles are created.

But it doesn't make any sense. The print module is already included in the index module.

What is the meaning of the fact that we connected the script tag?

<script src="./print.bundle.js"></script>

it doesn't do anything and only confuses. I think you should agree that the example needs to be redone.

If you wanted to show how the assembly of individual modules works and their application on an html page as separate modules, you need to assemble two separate bundles - for example, in one bundle the hello function, and in the other the print function. Then, connect the modules to the web page using the script tag. And use these functions (modules) on the page itself

What was the point of connecting print at all.a js module on html if the print function which is not even global? It turns out that we already have 2 print functions, while one is not global and there is no access to it.

This is the same if we were explaining to children how gasoline works in a car, but instead of refueling the car, we poured gasoline on the road. It doesn't make any sense.

I am already quite an experienced developer, but even this example has brought me into a stupor, not to mention beginners. Examples should be objective and taken from life tasks, otherwise why else make such wonderful tools as webpack.

I hope for your understanding, I'm sorry if I misunderstood something.

Yeah, it's sort of confusing at the first sight. But how are you gonna useprintMe function defined inprint.js if you don't import it? And note that it's not exposed as a global variable in our example so you can't just callprintMe.
Here's how I would reason about it,

1. first, you write code in ESM, there's nothing special here even if you're going to use webpack to bundle your code
2. you decide to output two bundles. In webpack, one entry would only output one bundle, that's why we define two entries. The contrived example is for education purpose, so it might not be easy to reason about.

Hope it helps.

First of all, thank you for the answer - it's very valuable.

But. This example is very strange. It is designed for beginners, but only misleads them.

Giving an example of the use of technology, an example is given in order to show the practical benefits of technology. Specifically, in this example, two bundles are created.

But it doesn't make any sense. The print module is already included in the index module.

What is the meaning of the fact that we connected the script tag?

<script src="./print.bundle.js"></script>

it doesn't do anything and only confuses. I think you should agree that the example needs to be redone.

If you wanted to show how the assembly of individual modules works and their application on an html page as separate modules, you need to assemble two separate bundles - for example, in one bundle the hello function, and in the other the print function. Then, connect the modules to the web page using the script tag. And use these functions (modules) on the page itself

What was the point of connecting print at all.a js module on html if the print function which is not even global? It turns out that we already have 2 print functions, while one is not global and there is no access to it.

This is the same if we were explaining to children how gasoline works in a car, but instead of refueling the car, we poured gasoline on the road. It doesn't make any sense.

I am already quite an experienced developer, but even this example has brought me into a stupor, not to mention beginners. Examples should be objective and taken from life tasks, otherwise why else make such wonderful tools as webpack.

I hope for your understanding, I'm sorry if I misunderstood something.

Thank you for the explanation, now I see the problem after running the code. I agree the contrived example is bad, will see how we can improve it.