thlorenz / browserify-shim

📩 Makes CommonJS incompatible files browserifyable.
MIT License
933 stars 87 forks source link

Variables not properly exported to global scope #188

Closed YPCrumble closed 8 years ago

YPCrumble commented 8 years ago

I'm getting the same issue as seen in this StackOverflow question. @edull24 has kindly made an example repo here that demonstrates the issue.

It seems that the "legacy" variable in @edull24 's repo should be globally scoped, but it doesn't get attached to the window object. I believe this is an issue that could be improved, but would love to hear from repo owners if this is expected behavior or if there's an appropriate workaround?

bendrucker commented 8 years ago

Can you be more clear about what the concern is here so we don't have to dig through SO?

YPCrumble commented 8 years ago

@bendrucker thanks for taking a look! The repo gets right to the point:

The file legacy.js represents legacy code that was written without the use of closures. The variable defined in legacy.js would be "global" to the legacy application.

This file is attempted to be shimmed in package.json by declaring an export value. However, the variable is not exported and is not available in the global scope.

I think a quick look at legacy.js, index.js, and package.json in the repo shows what I mean - in lines 3-6 of index.js the issue is:

I would expect to see the string 'A legacy global variable' written to the console after executing this statement, since it was "exported" in package.json.

...but the variable isn't getting attached to the global object.

bendrucker commented 8 years ago

We can definitely look at a PR for exposing var declarations on window. Not something I can work on from scratch though.

YPCrumble commented 8 years ago

I've recently come back to this and I think we can close it. My workaround is simply to declare any variables I want in the global scope as globally scoped variables, i.e., I'm declaring the following for globally-scoped jQuery and Bootstrap:

$ = jQuery = require('jquery');
require('bootstrap');

It basically means that if you want to pollute the global scope, you have to do it manually. I think it's probably the correct method.

bendrucker commented 8 years ago

Nice!