Skip to content
This repository has been archived by the owner on Apr 8, 2020. It is now read-only.

Update Aurelia SPA template #853

Merged
merged 1 commit into from
May 4, 2017
Merged

Update Aurelia SPA template #853

merged 1 commit into from
May 4, 2017

Conversation

MeirionHughes
Copy link
Contributor

@MeirionHughes MeirionHughes commented Apr 9, 2017

  • Updates to new aurelia-webpack-plugin (Webpack 2).
  • Enables webpack hmr support by default

todo:

@dnfclas
Copy link

dnfclas commented Apr 9, 2017

@MeirionHughes,
Thanks for your contribution.
To ensure that the project team has proper rights to use your work, please complete the Contribution License Agreement at https://cla2.dotnetfoundation.org.

It will cover your contributions to all .NET Foundation-managed open source projects.
Thanks,
.NET Foundation Pull Request Bot

@dnfclas
Copy link

dnfclas commented Apr 9, 2017

@MeirionHughes, thanks for signing the contribution license agreement. We will now validate the agreement and then the pull request.

Thanks, .NET Foundation Pull Request Bot

{ test: /\.css$/, loaders: [ 'style-loader', 'css-loader' ] },
{ test: /\.(png|woff|woff2|eot|ttf|svg)$/, loader: 'url-loader?limit=100000' },
{ test: /\.json$/, loader: 'json-loader' }
module: { // (4)
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

// (4) ? ;)

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

removed

var path = require('path');
var webpack = require('webpack');
var AureliaWebpackPlugin = require('aurelia-webpack-plugin');
const isDevBuild = process.argv.indexOf('--env.prod') < 0;
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Seems quite ugly. The --env.YYY option is there so you can module.exports = function(env) where env will be an object containing the passed in env.YYY.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

switched to what the others are using:

module.exports = (env) => {
    const isDevBuild = !(env && env.prod);

@EisenbergEffect
Copy link

Deferring to @niieani When he says it's good, then I'm happy :)

{ test: /\.css$/, loaders: [ 'style-loader', 'css-loader' ] },
{ test: /\.(png|woff|woff2|eot|ttf|svg)$/, loader: 'url-loader?limit=100000' },
{ test: /\.json$/, loader: 'json-loader' }
module.exports = (env) => {
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

You can set a default empty object (env = {}) => here and you won't have to env && every time it's used :) Also, it might be arguably better to use destructuring here (maybe even with reassignment), like: ({prod} = {}).

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

done. :)


const bundleOutputDir = './wwwroot/dist';

return [{
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Why return an array?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

remnant of either the old config or from the one of the other templates. /removed.

@MeirionHughes
Copy link
Contributor Author

@niieani I've checked the production build with:

webpack --config webpack.config. vendor.js -p
webpack -p
dotnet run --env Production

it appears to be working fine (named slots working too).

@nmocruz
Copy link

nmocruz commented Apr 13, 2017

Why not use includeAll: "ClientApp" in AureliaPlugin instead of PLATFORM.moduleName in every module?

@MeirionHughes
Copy link
Contributor Author

MeirionHughes commented Apr 13, 2017

I've been told that includeAll was added to make it easier to migrate older projects; moving forward though, it places some limitations on how your code can be optimised and so you should generally use PLATFORM.moduleName.

@jods4
Copy link

jods4 commented Apr 13, 2017

@nmocruz
I created includeAll as an easy way to migrate your existing project. Basically it means: just include all files in my source folder and be done.

It does have drawbacks, though:

  • You'll have a larger output because it prevents quite a few optimizations on all your files, such as: unused code removal, module renaming, exports renaming, tree shaking.
  • It prevents code splitting.
  • It does not validate at build time that your module strings actually exist.

Overall you're missing out quite a lot on what webpack can offer. This is like going back to an AMD + gulp build that is just taking all files in all source and libs and concat them together in a single big file.

@nmocruz
Copy link

nmocruz commented Apr 14, 2017

@jods4 Ok, make sense. I need to get used to the idea of use PLATFORM.moduleName('my-module').
I was really unhappy with this change, after behing using just a string for some time. Is not so bad but shorter could be better.

@jods4
Copy link

jods4 commented Apr 14, 2017

For libraires it's important to have a common, easily recognizable syntax (because JS is hard to analyze).
In your own code it might be different and in fact I already have everything required in place for you to define shorter synonyms.

You should also find that the places where module names appear are usually quite few.

@nmocruz
Copy link

nmocruz commented Apr 14, 2017

You should also find that the places where module names appear are usually quite few.
yes, looks a good idea. I understand that PLATFORM.moduleName is a much more clear way but after the old approach it looks like repeating PLATFORM.moduleName just to be webpack friendly.
Anyway, congratulation for this.

@EisenbergEffect
Copy link

@SteveSanderson This is approved and ready to go on our side.

@ClaudioNunes
Copy link

ClaudioNunes commented Apr 24, 2017

@SteveSanderson any estimate on when this merge will occur?
HMR support is eargely waited.

@ry8806
Copy link

ry8806 commented Apr 27, 2017

I think this account is probably the one he uses (its more active) @SteveSandersonMS
Looking forward to seeing this merged soon!!!

@ClaudioNunes
Copy link

@SteveSandersonMS @EisenbergEffect Any updates?

@EisenbergEffect
Copy link

@SteveSandersonMS We definitely need this merged ASAP...please.

@SteveSandersonMS SteveSandersonMS merged commit 37df309 into aspnet:dev May 4, 2017
@SteveSandersonMS
Copy link
Member

@MeirionHughes Great job on this! A really clean, straightforward PR. Also I'm impressed by the improvements to Aurelia itself - the new HMR functionality works brilliantly.

I'll now work on publishing the updated template package to NuGet.

@EisenbergEffect
Copy link

Thanks @SteveSandersonMS !

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

9 participants