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

14th
Jan 2016
Sam Jones
@ollwenjones
Jan 14 2016 03:32
Anyone had any luck adding asynchronous code-split chunks to the webpack config and getting AsyncRoute to consume them? I've tried multiple things that seemed right, and I keep getting hung on a Uncaught reflect-metadata shim is required when using class decorators error though...
Sam Jones
@ollwenjones
Jan 14 2016 15:32
I had to add the require.d.ts require definition for webpack in order to use the webpack.ensure for the code-splitting, and then used the promise-loader since AsyncRoute expects a promise (where ensure uses a callback). Code-splitting success (new chunk, ftw), just no making it go. The app errors out immediately on-load (before the route is triggered,) and trace back to the vendor.bundle.js ... maybe something to do with the fact that the async component isn't imported in the app.ts so it's not properly type-script processed?
binarious
@binarious
Jan 14 2016 15:56
Is it possible to access webpack's metadata (e.g. {%= o.webpackConfig.metadata.baseUrl %}) inside my component's templates?
ewnd9
@ewnd9
Jan 14 2016 16:12
@binarious you could take a closer look to html-loader sources, where does it get metadata
binarious
@binarious
Jan 14 2016 16:13
@ewnd9 good point, thanks.
ewnd9
@ewnd9
Jan 14 2016 16:13
np
Sam Jones
@ollwenjones
Jan 14 2016 16:14
@binarious, seems like it would work in external html templates being processed by webpack html-loader, but probably not in inline template string literals.
binarious
@binarious
Jan 14 2016 16:14
@ollwenjones I load my templates via webpack's require function. That should work then.
Sam Jones
@ollwenjones
Jan 14 2016 16:16
asynchronously? I'm trying to load a whole component/module as a separate bundle.
binarious
@binarious
Jan 14 2016 16:18
Nah, synchonously. I have a huge app and no problems with loading all at once.
Sam Jones
@ollwenjones
Jan 14 2016 16:20
Upon closer inspection, though, I think when I added require typescript definition might be where things broke... I wasn't able to get the UI to load again after commenting out my whole AsyncRoute block...
I know this app is going to get too big for that... besides chunk splitting is one of the main reasons to use webpack, imo
Sam Jones
@ollwenjones
Jan 14 2016 20:59
I re-did the work without the require type definition, and still having trouble. Webpack is creating the split point, but getting errors at runtime trying to pass the promise-loader result as the AsyncRoute loader property. Either Type Error: Promise is not a Function... or if I wrap the "Promise" and return it, I get Type Error: loader(...).then is not a function. I'm new to interpreting zone.js traces and also new to TypeScript. Are those type-script errors or just JS errors?