aspnet / JavaScriptServices

[Archived] This repository has been archived
Apache License 2.0
3.03k stars 518 forks source link

reactredux template error on publish Error in vendorjs from UglifyJs #715

Closed richardjharding closed 7 years ago

richardjharding commented 7 years ago

Just installed the templates using the latest tooling and created a new reactredux project

restore and build succeed but publish fails - it seems to be an error attempting to webpack the vendor chunk when in production mode

If I attempt to run the following at the cmd line webpack.js --config webpack.config.vendor.js --env.prod

I get the following error

ERROR in vendor.js from UglifyJs SyntaxError: Unexpected token: name (b) [vendor.js:34464,5]

That line in vendor.js is

let b = new Big(0);

If I run webpack without the --env.prod switch it succeeds

I get a similar error with the react template

this looks to be an issue with outputing es6 that uglify doesn't understand?

pdl5p commented 7 years ago

I've been staring at this for a while too.

I've managed to narrow the problem down to the style-loader module that is included in the sharedConfig/entry/vendor array in webpack.config.vendor.js

If I remove style-loader from the array the webpack prod build is successful, and so far the app seems to work ok.

I thought style-loader was a webpack loader so not sure if trying to include it in the vendor bundle is a bug?

grufffta commented 7 years ago

You can fix this by editing the webpack.config.vendor.js

module: { rules: [ { test: /.*style-loader.*\.jsx?$/, use: 'babel-loader'}, ...

richardjharding commented 7 years ago

yep that fixed it - but I'm not sure I understood why - when pdl5p pointed at it as being the cause and questioned where it needed to be in vendor chunk - I looked for examples of loading styles at via the style-loader eg calls like

var style = require("style-loader!css-loader!./file.css");

But couldn't find any in the source - so how does adding the test to the rules tell webpack that the script-loader source needs to be run through babel ?

grufffta commented 7 years ago

I've been thinking about this @richardjharding and I'm not really sure my only reasoning is the code still has to be piped through style loader as part of the transformation and when it is and encounters an ES6 import it fails. The babel loader transpiles it to the vendor code to es5 - the style loader bit is there to stop it matching all files in the folder and making the build long.

But I'm new to webpack so couldn't say for sure.

loune commented 7 years ago

I ran into this issue as well. I'm of the opinion that style-loader shouldn't be included in the production vendor.js since it's for adding ad-hoc