"Can't find variable: _"

[uberspeck]

Version

2.3.4

Test Case

When I update to v2.3.4 i get the console error "Can't find variable: _". Reverting to 2.3.3 fixes the error. Assuming it's a dependency version problem? I'm using loadash#4.15.0. Here's my bower.json...

{
  ...,
  "dependencies": {
    "angular": "1.5.8",
    "angular-animate": "1.5.8",
    "angular-bootstrap": "2.1.3",
    "angular-cookies": "1.5.8",
    "angular-file-upload": "2.2.0",
    "angular-google-analytics": "1.1.6",
    "angular-google-maps": "2.3.3",
    "angular-locker": "2.0.4",
    "angular-messages": "1.5.8",
    "angular-mocks": "1.5.8",
    "angular-sanitize": "1.5.8",
    "angular-touch": "1.5.8",
    "angular-translate": "2.11.1",
    "angular-translate-interpolation-messageformat": "2.11.1",
    "angular-translate-loader-static-files": "2.11.1",
    "angular-translate-storage-cookie": "2.11.1",
    "angular-translate-storage-local": "2.11.1",
    "angular-ui-router": "0.2.18",
    "angular-validation-match": "1.7.1",
    "angularjs-rails-resource": "2.2.0",
    "angularUtils-pagination": "angular-utils-pagination#0.11.1",
    "jquery": "2.1.*",
    "lodash": "4.15.0",
    "messageformat": "0.3.1",
    "moment": "2.11.1",
    "ng-device-detector": "2.0.3",
    "ng-idle": "1.1.1",
    "re-tree": "0.0.2",
    "spin.js": "2.3.2",
    "highcharts-ng": "0.0.11",
    "highcharts": "4.2.5"
  },
  "resolutions": {
    "angular-cookies": "1.5.8",
    "angular": "1.5.8"
  }
}

[enniob]

I go the same error when I update lodash to the latest version. So I had to keep lodash to version 4.13.1

[ryuker16]

I'm using the lastest version of lodash and it works fine if I include it directly via script tag via HTML.

[uberspeck]

According to #1937 it was introduced by bb083cd. It looks like @pocesar has figured out a workaround (for JSPM) and created a branch that solves the issue.

[uberspeck]

I wonder if Stopped unconditional global exports in the browser in the lodash changelog is the culprit? I don't really want to rewire my build process to fix this but I'm loath to run with outdated libs if I can help it. Maybe @jdalton will have a suggestion? :-)

[jdalton]

I'd like to know more about how unconditional export to window is used here.
Most folks just complained about it :D

[uberspeck]

Thanks for responding @jdalton. Unfortunately I'm not sure I know enough to answer your question properly :( What I can say is my build process is just a simple concatenation/minification (via gulp) of my vendor libs into one file (vendor-[hash].js) and my application resources into another (app-[hash].js). I'm not using any async loading or anything of that nature. Just relying on globals. Does that answer your question? I'd be happy to provide code examples etc if you can point me in the right direction. I can't give access to the repo unfortunately as our product is proprietary and subject to HIPAA regs.

[jdalton]

@uberspeck Lodash will export to the global (window) in the browser unless it detects a node-like environment.

[uberspeck]

Makes sense. In that case, it seems something is just fundamentally broken with angular-google-maps

I am facing the same issue from past 2 weeks ever since I upgraded to lodash 4.15.0, but it doesn't work even if I switch back to lodash 3.8.0. Are we fixing this any sooner??

Switching back to 2.3.3 works fine even with latest 4.13.1

[nmccready]

So this is mainly an issue with bower or npm? Also how are you building the app? Webpack, browserify, and main-bower-files? There are still a lot of unknown here to proceed to debug. Anyway please reference me by name in this ticket or I won't get a notification.

@nmccready, I am using browserify, gulp & npm with nodes v5.11.1.
I remember reading somewhere that it's an issue with npm where it isn't able to load _ as global variable. Having said that, my npm script doesn't have any kind of global installation concept. But, it works fine with lodash 4.13.1 only if I switch back to 2.3.3 version.

Please let me know how can be of more help to make maps bug free

[nmccready]

@sategroup does browserify have anything equivalent to https://webpack.github.io/docs/shimming-modules.html ?

[nmccready]

@sategroup https://www.npmjs.com/package/browserify-global-shim , anyway these problems are not a surprise since the project is not built with CommonJS. If someone else wants to make the PR to convert to use CommonJS by all means go for it. Webpack is already a dependency in the project for other dependencies. But as of right now since this project is basically dead, I do not see this being worth my time.

[nmccready]

Here is how it works in webpack proving it can be done:

• https://github.com/angular-ui/angular-google-maps/blob/master/grunt/options/webpack.coffee#L13-L25
• https://github.com/angular-ui/angular-google-maps/blob/master/spec/js/acceptance/app.js
• https://github.com/angular-ui/angular-google-maps/blob/master/karma.acceptance.conf.coffee