Update Aurelia SPA template #853

MeirionHughes · 2017-04-09T07:59:31Z

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

todo:

needs review (@EisenbergEffect or @niieani)
check production build

dnfclas · 2017-04-09T07:59:35Z

@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 · 2017-04-09T08:04:41Z

@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

niieani · 2017-04-09T08:16:54Z

templates/AureliaSpa/webpack.config.js

- { 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)


// (4) ? ;)

niieani · 2017-04-09T08:31:02Z

templates/AureliaSpa/webpack.config.js

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


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.

switched to what the others are using:

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

EisenbergEffect · 2017-04-09T13:30:31Z

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

niieani · 2017-04-09T14:33:35Z

templates/AureliaSpa/webpack.config.js

- { 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) => {


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} = {}).

niieani · 2017-04-09T14:33:58Z

templates/AureliaSpa/webpack.config.js

+
+ const bundleOutputDir = './wwwroot/dist';
+
+ return [{


Why return an array?

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

MeirionHughes · 2017-04-11T04:32:54Z

@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 · 2017-04-13T16:39:54Z

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

MeirionHughes · 2017-04-13T20:02:23Z

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 · 2017-04-13T20:03:55Z

@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 · 2017-04-14T07:45:16Z

@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 · 2017-04-14T08:34:58Z

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 · 2017-04-14T09:08:13Z

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 · 2017-04-23T06:00:01Z

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

ClaudioNunes · 2017-04-24T18:23:02Z

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

ry8806 · 2017-04-27T10:00:38Z

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

ClaudioNunes · 2017-05-03T18:24:39Z

@SteveSandersonMS @EisenbergEffect Any updates?

EisenbergEffect · 2017-05-03T23:45:55Z

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

SteveSandersonMS · 2017-05-04T11:45:53Z

@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 · 2017-05-04T16:18:57Z

Thanks @SteveSandersonMS !

aspnet/JavaScriptServices#853

dnfclas added the cla-required label Apr 9, 2017

dnfclas added cla-signed and removed cla-required labels Apr 9, 2017

niieani reviewed Apr 9, 2017

View reviewed changes

Update Aurelia SPA template

37df309

MeirionHughes mentioned this pull request Apr 29, 2017

enable hot module reload in the aurelia spa sample #898

Closed

SteveSandersonMS merged commit 37df309 into aspnet:dev May 4, 2017

aligneddev mentioned this pull request May 4, 2017

Please provide guidance on how to upgrade #920

Closed

aligneddev pushed a commit to aligneddev/aureliaEnergyJSServices that referenced this pull request May 4, 2017

update to HMR abled Aurelia

6a34bab

aspnet/JavaScriptServices#853

This was referenced Sep 1, 2021

[Snyk] Security upgrade css-loader from 0.28.4 to 2.0.0 harunpehlivan/JavaScriptServices#49

Open

[Snyk] Security upgrade css-loader from 0.28.4 to 2.0.0 harunpehlivan/JavaScriptServices#50

Open

harunpehlivan mentioned this pull request May 14, 2022

[Snyk] Fix for 1 vulnerabilities harunpehlivan/JavaScriptServices#76

Open

harunpehlivan mentioned this pull request May 14, 2022

[Snyk] Fix for 1 vulnerabilities harunpehlivan/JavaScriptServices#77

Open

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Update Aurelia SPA template #853

Update Aurelia SPA template #853

MeirionHughes commented Apr 9, 2017 •

edited

Loading

dnfclas commented Apr 9, 2017

dnfclas commented Apr 9, 2017

niieani Apr 9, 2017

MeirionHughes Apr 9, 2017

niieani Apr 9, 2017

MeirionHughes Apr 9, 2017

EisenbergEffect commented Apr 9, 2017

niieani Apr 9, 2017

MeirionHughes Apr 9, 2017

niieani Apr 9, 2017

MeirionHughes Apr 9, 2017

MeirionHughes commented Apr 11, 2017

nmocruz commented Apr 13, 2017

MeirionHughes commented Apr 13, 2017 •

edited

Loading

jods4 commented Apr 13, 2017

nmocruz commented Apr 14, 2017

jods4 commented Apr 14, 2017

nmocruz commented Apr 14, 2017

EisenbergEffect commented Apr 23, 2017

ClaudioNunes commented Apr 24, 2017 •

edited

Loading

ry8806 commented Apr 27, 2017

ClaudioNunes commented May 3, 2017

EisenbergEffect commented May 3, 2017

SteveSandersonMS commented May 4, 2017

EisenbergEffect commented May 4, 2017

Update Aurelia SPA template #853

Update Aurelia SPA template #853

Conversation

MeirionHughes commented Apr 9, 2017 • edited Loading

dnfclas commented Apr 9, 2017

dnfclas commented Apr 9, 2017

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

EisenbergEffect commented Apr 9, 2017

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

MeirionHughes commented Apr 11, 2017

nmocruz commented Apr 13, 2017

MeirionHughes commented Apr 13, 2017 • edited Loading

jods4 commented Apr 13, 2017

nmocruz commented Apr 14, 2017

jods4 commented Apr 14, 2017

nmocruz commented Apr 14, 2017

EisenbergEffect commented Apr 23, 2017

ClaudioNunes commented Apr 24, 2017 • edited Loading

ry8806 commented Apr 27, 2017

ClaudioNunes commented May 3, 2017

EisenbergEffect commented May 3, 2017

SteveSandersonMS commented May 4, 2017

EisenbergEffect commented May 4, 2017

MeirionHughes commented Apr 9, 2017 •

edited

Loading

MeirionHughes commented Apr 13, 2017 •

edited

Loading

ClaudioNunes commented Apr 24, 2017 •

edited

Loading