Shims break with browserify noParse option #17

Open
JonET opened this Issue Sep 8, 2013 · 19 comments

Comments

Projects
None yet
8 participants
@JonET

JonET commented Sep 8, 2013

I'd like to be able to speed up my browserify processing time by using noParse on large shimmed dependencies. Unfortunately the shim itself depends on global which doesn't get added to the file unless it's parsed. causing the error...

Uncaught ReferenceError: global is not defined

I found another example of this issue here .

@thlorenz

This comment has been minimized.

Show comment
Hide comment
@thlorenz

thlorenz Sep 8, 2013

Owner

Seems to me like this is a browserify issue. Could we please verify that this is intended?

If it is browserify-shim could fall back to window, i.e.: global = global || window

Owner

thlorenz commented Sep 8, 2013

Seems to me like this is a browserify issue. Could we please verify that this is intended?

If it is browserify-shim could fall back to window, i.e.: global = global || window

@JonET

This comment has been minimized.

Show comment
Hide comment
@JonET

JonET Sep 8, 2013

I don't think this is a browserify issue. It's doing the correct thing and not adding node globals when I ask it not to parse shimmed files. It should be possible to re-write the shim to not depend on global.

What browserify will do when processing shimmed files is insert a statement like var global=self; right before the shimmed code. Maybe using self instead of global is the correct answer?

JonET commented Sep 8, 2013

I don't think this is a browserify issue. It's doing the correct thing and not adding node globals when I ask it not to parse shimmed files. It should be possible to re-write the shim to not depend on global.

What browserify will do when processing shimmed files is insert a statement like var global=self; right before the shimmed code. Maybe using self instead of global is the correct answer?

@JonET

This comment has been minimized.

Show comment
Hide comment
@JonET

JonET Sep 8, 2013

Or maybe to be safe insert a var __shim_global=self; before the shim starts and use that. Libraries might overwrite self.

JonET commented Sep 8, 2013

Or maybe to be safe insert a var __shim_global=self; before the shim starts and use that. Libraries might overwrite self.

@thlorenz

This comment has been minimized.

Show comment
Hide comment
@thlorenz

thlorenz Dec 10, 2013

Owner

Happened to look through grunt-browserify and found that it actually adds the var global = self.

Is that the cause of your issue? If yes, please file it there.

Also with v3 of browserify-shim you can simply config everything in the package.json and most likely no longer need to do it through that grunt tool.

Owner

thlorenz commented Dec 10, 2013

Happened to look through grunt-browserify and found that it actually adds the var global = self.

Is that the cause of your issue? If yes, please file it there.

Also with v3 of browserify-shim you can simply config everything in the package.json and most likely no longer need to do it through that grunt tool.

@johnkpaul

This comment has been minimized.

Show comment
Hide comment
@johnkpaul

johnkpaul Dec 10, 2013

I think that this was fixed with an unrelated change sometime in the past few months. I don't use grunt-browserify, but I no longer have this problem and have successfully added back everything to noParse. I don't remember exactly when that happened, but it definitely works for me now.

I think that this was fixed with an unrelated change sometime in the past few months. I don't use grunt-browserify, but I no longer have this problem and have successfully added back everything to noParse. I don't remember exactly when that happened, but it definitely works for me now.

@thlorenz thlorenz closed this Dec 21, 2013

@bclinkinbeard

This comment has been minimized.

Show comment
Hide comment
@bclinkinbeard

bclinkinbeard Mar 21, 2014

This is still an issue, as demonstrated by this zip. Download it, run npm i, then npm run bundleNoParse, and open index.html. You will see the "global is not defined" error in the console. If you do npm run bundle, you do not get the error. http://cl.ly/3c1E3P2U273U

This is still an issue, as demonstrated by this zip. Download it, run npm i, then npm run bundleNoParse, and open index.html. You will see the "global is not defined" error in the console. If you do npm run bundle, you do not get the error. http://cl.ly/3c1E3P2U273U

@thlorenz

This comment has been minimized.

Show comment
Hide comment
@thlorenz

thlorenz Mar 21, 2014

Owner

@bclinkinbeard thanks for tracking this down.

Ccould you please put this zip up in a repo, so we can look and comment on the code?
Also what is the suggested fix if global is not present? Should we use window instead?

I'm confused why global is not present in one case but is in another - isn't that an inconsistency in browserify and should be solved there?

Owner

thlorenz commented Mar 21, 2014

@bclinkinbeard thanks for tracking this down.

Ccould you please put this zip up in a repo, so we can look and comment on the code?
Also what is the suggested fix if global is not present? Should we use window instead?

I'm confused why global is not present in one case but is in another - isn't that an inconsistency in browserify and should be solved there?

@bclinkinbeard

This comment has been minimized.

Show comment
Hide comment
@bclinkinbeard

bclinkinbeard Mar 21, 2014

Pushed to https://github.com/bclinkinbeard/noParse-bug-demo

I honestly don't know enough about Browserify's internals to know what the proper fix or root cause is. It may very well be a Browserify issue. The bundle.js that is committed is the problematic version from npm run bundleNoParse. Note I even added the --ig flag, which is supposed to insert the globals no matter what, and it doesn't help.

/cc @substack

Pushed to https://github.com/bclinkinbeard/noParse-bug-demo

I honestly don't know enough about Browserify's internals to know what the proper fix or root cause is. It may very well be a Browserify issue. The bundle.js that is committed is the problematic version from npm run bundleNoParse. Note I even added the --ig flag, which is supposed to insert the globals no matter what, and it doesn't help.

/cc @substack

@thlorenz

This comment has been minimized.

Show comment
Hide comment
@thlorenz

thlorenz Mar 21, 2014

Owner

Thanks I will have a look, maybe I can implement a workaround for now (as mentioned above) although I'm pretty sure that --noparse or not, global should be present in either both or none.

Owner

thlorenz commented Mar 21, 2014

Thanks I will have a look, maybe I can implement a workaround for now (as mentioned above) although I'm pretty sure that --noparse or not, global should be present in either both or none.

@thlorenz thlorenz reopened this Mar 21, 2014

@thlorenz thlorenz self-assigned this Mar 30, 2014

@thlorenz

This comment has been minimized.

Show comment
Hide comment
@thlorenz

thlorenz Apr 4, 2014

Owner

Are there any news on this issue (has anyone filed an issue with browserify)?
Or should I accept the fact that we need to add a workaround here?

Owner

thlorenz commented Apr 4, 2014

Are there any news on this issue (has anyone filed an issue with browserify)?
Or should I accept the fact that we need to add a workaround here?

@bclinkinbeard

This comment has been minimized.

Show comment
Hide comment
@bclinkinbeard

bclinkinbeard Apr 4, 2014

I just discovered that defining the shims with the "angular": "global:angular" syntax avoids the error. Does that tell us anything?

I just discovered that defining the shims with the "angular": "global:angular" syntax avoids the error. Does that tell us anything?

@thlorenz

This comment has been minimized.

Show comment
Hide comment
@thlorenz

thlorenz May 22, 2014

Owner

@bclinkinbeard unfortunately not much, I'll have a look when I get a chance.

Could you check though if this possibly got fixed with the latest browserify version?

Thanks.

Owner

thlorenz commented May 22, 2014

@bclinkinbeard unfortunately not much, I'll have a look when I get a chance.

Could you check though if this possibly got fixed with the latest browserify version?

Thanks.

@bclinkinbeard

This comment has been minimized.

Show comment
Hide comment
@bclinkinbeard

bclinkinbeard May 28, 2014

Still happening with b-shim 3.5.0 and Browserify 4.1.6

Still happening with b-shim 3.5.0 and Browserify 4.1.6

@thlorenz

This comment has been minimized.

Show comment
Hide comment
@thlorenz

thlorenz May 28, 2014

Owner

@bclinkinbeard thanks.
Will have a closer look then when I'm back from jsconf.

Owner

thlorenz commented May 28, 2014

@bclinkinbeard thanks.
Will have a closer look then when I'm back from jsconf.

@knownasilya

This comment has been minimized.

Show comment
Hide comment
@knownasilya

knownasilya Aug 18, 2014

@thlorenz has there been any movement on this?

@thlorenz has there been any movement on this?

@knownasilya

This comment has been minimized.

Show comment
Hide comment
@AndrewKovalenko

This comment has been minimized.

Show comment
Hide comment
@AndrewKovalenko

AndrewKovalenko Oct 23, 2014

I have the same issue.
In my app I use twitter bootstrap, which is dependent from jQuery, so I added shims for this two libs

"browser": {
    "bootstrap": "./node_modules/bootstrap/dist/js/bootstrap.js",
    "jquery": "./node_modules/jquery/dist/jquery.js"
  },
  "browserify": {
    "transform": [
      "browserify-shim"
    ]
  },
  "browserify-shim": {
    "jquery": "jQuery",
    "bootstrap": { "depends": ["jquery:jQuery"], "exports": null }
  }

when I add jquery and bootstrap to noparse list, browserify-shims transforms code and adds ; jQuery = global.jQuery = require("<...project path...>/node_modules/jquery/dist/jquery.js"); before bootstrap code. But because window.global doesn't exist, I get Uncaught ReferenceError: global is not defined.

However, if I don't use noparse, browserify-shims wraps ; jQuery = global.jQuery = require("<...project path...>/node_modules/jquery/dist/jquery.js");+ bootstrap code into self-called function and passes global as parameter there, so everything is working fine.

I have the same issue.
In my app I use twitter bootstrap, which is dependent from jQuery, so I added shims for this two libs

"browser": {
    "bootstrap": "./node_modules/bootstrap/dist/js/bootstrap.js",
    "jquery": "./node_modules/jquery/dist/jquery.js"
  },
  "browserify": {
    "transform": [
      "browserify-shim"
    ]
  },
  "browserify-shim": {
    "jquery": "jQuery",
    "bootstrap": { "depends": ["jquery:jQuery"], "exports": null }
  }

when I add jquery and bootstrap to noparse list, browserify-shims transforms code and adds ; jQuery = global.jQuery = require("<...project path...>/node_modules/jquery/dist/jquery.js"); before bootstrap code. But because window.global doesn't exist, I get Uncaught ReferenceError: global is not defined.

However, if I don't use noparse, browserify-shims wraps ; jQuery = global.jQuery = require("<...project path...>/node_modules/jquery/dist/jquery.js");+ bootstrap code into self-called function and passes global as parameter there, so everything is working fine.

@outring

This comment has been minimized.

Show comment
Hide comment
@outring

outring Jan 23, 2015

Same thing here 👍

outring commented Jan 23, 2015

Same thing here 👍

@darky

This comment has been minimized.

Show comment
Hide comment
@darky

darky Feb 12, 2015

👍 It's high priority issue for many UMD-like modules

darky commented Feb 12, 2015

👍 It's high priority issue for many UMD-like modules

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment