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

15th
Jan 2016
binarious
@binarious
Jan 15 2016 07:55
@ollwenjones TypeScript doesn't produce client-side errors, because the browser just runs the compiled js. Those are JavaScript errors. I can't help with the async loading though.
Niall O'Brien
@niallobrien
Jan 15 2016 11:39
Hey guys, has anyone built a MEAN solution with this starter-pack?
Sam Jones
@ollwenjones
Jan 15 2016 14:02
Thanks @binarious
Sam Jones
@ollwenjones
Jan 15 2016 15:57

Finally sorted my problem, in case anyone else runs into issues with bundle-splitting and AsyncRoute. After looking at the ts-loader docs more closely:

//This just tells typescript to be ready for this type,
// the require call won't be emitted to webpack:
import SubModule = require('../submodule/submodule');

function loadSubModule() {
  var promise = new Promise<SubModule>((resolve, reject) => {
    require.ensure(['../submodule/submodule'], function(require) {
      /*from ts-loader example docs:*/
      // "These require calls are emitted (note these are NOT TypeScript
      // `import ... require` statements). `require.ensure` is defined in
      // require.d.ts. Webpack sees this and automatically puts submodule
      // into a separate chunk."
      var wrapper = <typeof submodule>require('../submodule/submodule');

      //wrapper is an object wrapper with a SubModule property,
      //which I did not expect
      resolve(wrapper.SubModule);
    });  
  });

  return promise;
}

then

@RouteConfig([
  { path: '/', component: Home, name: 'Index' },
  { path: '/home', component: Home, name: 'Home' },
  //{ path: '/sub', component: SubModule, name: 'SubModule' },
  new AsyncRoute({
    path: '/sub', loader:loadSubModule, name: 'SubModule'
  }),
  { path: '/**', redirectTo: ['Index'] }
])
Ruy Rodrigo Garcia Chavez
@rrgarciach
Jan 15 2016 16:05
Hi. Can anyone explain me the functionality of the "..." at the beginning of a dependency name when passing in an array as a parameter?
bootstrap(App, [
    ...('production' === process.env.ENV ? [] : ELEMENT_PROBE_PROVIDERS),
    ...HTTP_PROVIDERS,
    ...ROUTER_PROVIDERS,
    provide(LocationStrategy, { useClass: HashLocationStrategy })
  ])
Sam Jones
@ollwenjones
Jan 15 2016 16:17
It's an ES6 'spread operator' if I'm not mistaken, which you can google for better explanations than I could give, @rrgarciach. My understanding is all the members of the HTTP_PROVIDERS collection, for example, get added to that array as individual members in sequence.
binarious
@binarious
Jan 15 2016 16:22
@ollwenjones Thanks for sharing your result!
Sam Jones
@ollwenjones
Jan 15 2016 16:28
Now I just have to get rid of the type errors on the webpack console without breaking it... #newtotypescript