search

ericalli / static-site-boilerplate

A better workflow for building modern static websites.
http://staticsiteboilerplate.com
MIT License
1.73k stars 165 forks source link

Omit Inline SourceMaps for Production builds. #27

Closed thegrandpoobah closed 5 years ago

thegrandpoobah commented 5 years ago

Describe the bug Production version of bundles contains inlined source maps which makes the bundles huge.

To Reproduce Steps to reproduce the behavior:

  1. Do ENV=production npm run start:dist
  2. Open the Network analysis tool in your favourite browser
  3. observe the bundle size (on my project that only really has jQuery and a carousel plugin, it is around 2MB with the sourcemap, without the sourcemap it is around 300k)

(see 'devtools' setting in webpack.config.js file which always sets the value to 'cheap-eval-source-map')

Expected behavior Source Maps should not be inlined on production because it creates huge JS files.

According to https://webpack.js.org/configuration/devtool/ for production this value should be one of the production values (do not specific devtool, 'source-map', 'hidden-source-map', and 'nosources-source-map') depending on what exactly you need.

recommendation

Reading the webpack docs, I'm inclined to say that 'hidden-source-map' is a good default option here. so omit a webpack.config.js file that has something like this line:

devtool: config.env === 'development' ? 'cheap-eval-source-map' : 'hidden-source-map',
thegrandpoobah commented 5 years ago

I'd be happy to try my hand at adding this if you agree to the change :)

ericalli commented 5 years ago

@thegrandpoobah Good catch! Absolutely, free free to submit a PR for this and I'll merge it in.