Shopify / sprockets-commoner

Use Babel in Sprockets to compile JavaScript modules for the browser
MIT License
182 stars 22 forks source link

Removing Reference to Top-Level Vars #43

Open deecewan opened 7 years ago

deecewan commented 7 years ago

Hey,

I'm trying to get a legacy project onto ES, and I'm having a few issues.

I'm only targeting *.es6.js files, so that we can slowly move across over time. That seems to be working fine for application.js.

My problem is that there are some variables defined at the bottom of application.js, and in other files at the top level.

They are then accessed from the templates.

e.g.

// application.js
var init_browser_warning = function() {
  $buoop = {vs:{i:9,f:12,o:11,s:10,n:9}, newwindow: true, url: 'http://browsehappy.com/'}
  $buoop.ol = window.onload;
  window.onload=function(){
   try {if ($buoop.ol) $buoop.ol();}catch (e) {}
   trigger_browser_update($buoop)
  }
}

then, in the page's template

<script>
init_browser_warning();
</script>

Before installing sprockets-commoner, I would get no errors. Now, these variables are undefined. The variables are still present at the bottom of application.js (after compilation, in the browser).

It makes me very cautious to move across, because I don't know what other things will break. The application is quite large and has been written over a long time.

Any advice as to how to rectify this (or even what is causing it? I can't see anything that Commoner has added that would cause this).

bouk commented 7 years ago

commoner wraps everything in a function, so top-level vars aren't available. Try doing window.init_browser_warning instead