What's the magic with webpack?

Question

JavaScript

I assembled a test project, webpack generated main.js, I connect it to index.html, I go to index.html and the code does not work, I look at the console "n is not a function", I look at dist / main.js in my project starts So:

... !function(e){var n ={}; ...

, I look at the same dist/main.js only through the console and see:

... !function(e){var t ={}; ...

.
Is it legal at all?
Through the server:

Inside the project:

Maybe there is an option that this is the node-static server decided to make fun of it? I just don’t understand at what step and who specifically changes the names of the variables for me, when the code clearly says one thing, and when I look through the browser, it’s different.

Answer 1

How is the cache configured? Disable it forcibly in devtools. Perhaps an earlier version of the minified script got into the cache.

Answer 2

What devServer shows you is not the same as what you will have after the build.