These are chat archives for AngularClass/angular2-webpack-starter

9th
Mar 2016
rvalimaki
@rvalimaki
Mar 09 2016 12:31
Hi, am I the only one to get "RangeError: Maximum call stack size exceeded" when trying to serve compiled bundles? webpack-dev-server works fine, more or less.
``` EXCEPTION: RangeError: Maximum call stack size exceededt.logError @ browser_adapter.ts:73t.logGroup @ browser_adapter.ts:84e.call @ exception_handler.ts:49(anonymous function) @ application_ref.ts:257e._notifyOnError @ ng_zone.ts:454t.onError @ ng_zone.ts:355e.run @ polyfills.8546ea7f0b535a24e15a.bundle.js:8093(anonymous function) @ ng_zone.ts:371(anonymous function) @ polyfills.8546ea7f0b535a24e15a.bundle.js:8066A @ polyfills.8546ea7f0b535a24e15a.bundle.js:7314N @ polyfills.8546ea7f0b535a24e15a.bundle.js:7326I @ polyfills.8546ea7f0b535a24e15a.bundle.js:7297(anonymous function) @ polyfills.8546ea7f0b535a24e15a.bundle.js:6969n @ ng_zone.ts:410e.run @ polyfills.8546ea7f0b535a24e15a.bundle.js:8089(anonymous function) @ ng_zone.ts:371(anonymous function) @ polyfills.8546ea7f0b535a24e15a.bundle.js:8066b @ polyfills.8546ea7f0b535a24e15a.bundle.js:7108
browser_adapter.ts:73 STACKTRACE:t.logError @ browser_adapter.ts:73e.call @ exception_handler.ts:52(anonymous function) @ application_ref.ts:257e._notifyOnError @ ng_zone.ts:454t.onError @ ng_zone.ts:355e.run @ polyfills.8546ea7f0b535a24e15a.bundle.js:8093(anonymous function) @ ng_zone.ts:371(anonymous function) @ polyfills.8546ea7f0b535a24e15a.bundle.js:8066A @ polyfills.8546ea7f0b535a24e15a.bundle.js:7314N @ polyfills.8546ea7f0b535a24e15a.bundle.js:7326I @ polyfills.8546ea7f0b535a24e15a.bundle.js:7297(anonymous function) @ polyfills.8546ea7f0b535a24e15a.bundle.js:6969n @ ng_zone.ts:410e.run @ polyfills.8546ea7f0b535a24e15a.bundle.js:8089(anonymous function) @ ng_zone.ts:371(anonymous function) @ polyfills.8546ea7f0b535a24e15a.bundle.js:8066b @ polyfills.8546ea7f0b535a24e15a.bundle.js:7108
sorry, that's pretty unreadable
angular/angular#5964 <- might be related
rvalimaki
@rvalimaki
Mar 09 2016 12:38
Seems that development build (npm run build:dev) is working for me on this regard. It's only build:prod, that's giving me that maximum call stack size exceeded.
Joanne Yae
@nyjy85
Mar 09 2016 23:31
How can i make a third party library into a global variable so that I don't have to import or require it in individual modules? For example, I want lodash to be globally available. How do i configure webpack to do this?
I tried to alias it like this : alias: {
lodash: path.resolve( __dirname, './node_modules/lodash')
}
then added a new plugin:
new webpack.ProvidePlugin({
myLodash: "lodash",
})
but it doesn't work
Ben
@sysupbda
Mar 09 2016 23:35
I was about to say that I use DI for such cases
Joanne Yae
@nyjy85
Mar 09 2016 23:35
What is DI?
Ben
@sysupbda
Mar 09 2016 23:35
But in fact I don't really have such cases anymore :)
Dependency Injection
I used lodash a lot in ES5, but there are only very few things I would be missing in ES6 that would justify me still using lodash with typescript or ES6
Not sure how you could DI an entire module though to be honest
Joanne Yae
@nyjy85
Mar 09 2016 23:36
well, you can do it with jquery
but it only works for jquery -_-;; and i dont know why
Ben
@sysupbda
Mar 09 2016 23:36
With the alias logic you mentioned?
Joanne Yae
@nyjy85
Mar 09 2016 23:37
for some reason you don't need an alias for jquery
new webpack.ProvidePlugin({
jQuery: 'jquery',
$: 'jquery',
jquery: 'jquery'
})
thats all you need
Ben
@sysupbda
Mar 09 2016 23:38
you've made me curious. Would like to see what others say how they would do this. But I really find it extremely rare to need a module across many components modules since typescript and ng2
Joanne Yae
@nyjy85
Mar 09 2016 23:38
you're right, its rare but i use lodash and moment everywhere
would like to have it available globally without requireing it in all my components
Ben
@sysupbda
Mar 09 2016 23:39
yep.. i understand. i'll keep watching for answers here :) you might have more success in a webpack specific chat though no?