Webpack . Calling Javascript functions at Window Level

Question

I am webpacking my javascript

alert("Loaded out")

function showLoaded() {
    alert("Loadedin")
}

Trying to call the function showloaded from html

<!DOCTYPE html>
<html>
  <head>
      <script type="text/javascript" src="./bundle.js"></script>
  </head>
<body>
<script>showLoaded()</script>
</body>
</html>

Loaded out is being displayed by alert , but I can't seem to call the function showLoaded(). Am I missing something obvious here.

doesn't webpack create a closure, to which it puts all your rendered source? — Patryk Cieszkowski
– Patryk Cieszkowski, Commented Aug 27, 2018 at 1:05

NoobTW · Accepted Answer · 2018-08-27 01:43:34Z

2

You can also expose your function this way:

alert("Loaded out");

function showLoaded() {
    alert("Loadedin");
}

window.showLoaded = showLoaded;

answered Aug 27, 2018 at 1:43

NoobTW

2,6242 gold badges27 silver badges46 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Shorn Jacob · Accepted Answer · 2018-08-27 01:50:40Z

1

Found Answer here, How to run functions that converted by webpack? . found answer here.

I had to add

output {


    libraryTarget: "this"

  }

to my webpack config for making the function visible on global (window) object.

and used export on function

export function showLoaded() {
    alert("Loadedin5")
}

edited Aug 27, 2018 at 1:50

answered Aug 27, 2018 at 1:40

Shorn Jacob

1,2516 gold badges24 silver badges41 bronze badges

Collectives™ on Stack Overflow

Webpack . Calling Javascript functions at Window Level

2 Answers 2

Comments

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Linked

Related