Lazy bundle broken after uglified.

[namelos]

I'm submitting a bug report

• Library Version:
  1.1.0

Please tell us about your environment:

• Operating System:
  OSX 10.x

• Node Version:
  6.2.0

• NPM Version:
  3.8.9

• JSPM OR Webpack AND Version
  webpack 2.1.0-beta.17

• Browser:
  Chrome XX

• Language:
  ESNext

Current behavior:
I was trying to lazy load some of my resources. So I cloned a brand new skeletion navigation, and choose esnext-webpack. When I:

1. add { "path": "users", "lazy": true, "bundle": "users" } in package.json aurelia.bulid.resources
2. use <require from="./users" lazy bundle="users"></require>

They just works fine in development env which don't uglify my code.

However, When I build in production env or just add a uglify in development build, they both crashes, before starting new resource request.

Error message:
Template markup must be wrapped in a <template> element e.g. <template> <!-- markup here --> </template>

[niieani]

That's quite odd. We'll investigate. It might be that lazy loading .HTML templates doesn't quite work as it's supposed to.

Also, note that you don't need to define the bundle or laziness in both places, one is enough (either the or package.json).

[namelos]

Thanks for the reply. I just forgot to mention I did use one way at a time. And the template lazy property is quite neat to use, hope we can use it soon enough :)

PS: Also a quick dumb question, I asked several times in Gitter but no luck to get a working answer...
I am using the esnext-webpack skeleton in skeleton-navigation repo. I found it seems to have a convention which pushes Aurelia related modules in the 'app' entry.
If I try to add multiple entry like 'app2' for different HTML in same website, the 'app2' would crash because it couldn't find any Aurelia module.
Is it possible to achieve multiple entries, while each use Aurelia/Aurelia-bootstrap as a same vendor with webpack?
It seems Aurelia related modules already been common chunks but I could not make 'app2' find them properly.
That really pains me when user download large bundles which contains actual same code repeatedly. :(

[niieani]

Not sure I understand your question in the PS. Could you rephrase or provide an example?

[namelos]

Thank you for your reply. And sorry for my poor English... Here's some configurations to clear my question.

Basically I am trying to get multiple entries work. There are multiple different entries in the website using Aurelia, so I wish I can let user just download Aurelia commons chunks only once.

Here's the config from skeleton navigation webpack esnext version:

entry: {
  'app': [/* this is filled by the aurelia-webpack-plugin */],
  'app2': [], //<--- for instance, I want to add another entry and use the same Aurelia commons chunks
  'aurelia-bootstrap': coreBundles.bootstrap,
  'aurelia': coreBundles.aurelia.filter(pkg => coreBundles.bootstrap.indexOf(pkg) === -1)
},
output: {
  path: outDir,
}

And I'm even failed when trying to make the config work in README:

var AureliaWebpackPlugin = require('aurelia-webpack-plugin');
var webpackConfig = {
  entry: 'index.js', //<--- how to tell Aurelia webpack plugin this is my entry?
  output: {
    path: 'dist',
    filename: 'index_bundle.js'
  },
  plugins: [new AureliaWebpackPlugin()]
}

So, any chance I could have multiple entries?

[niieani]

@namelos I'm working on something that will simplify your use case. Stay tuned.

[EisenbergEffect]

@niieani Is this also part of the upcoming new webpack skeleton?

[niieani]

@EisenbergEffect I'll keep this one in mind when working on the new webpack plugin/skeleton.

[niieani]

Fixed by aurelia/skeleton-navigation#714