Generate JavaScript sourcemaps in production

Resolves instructure/canvas-lms#1101

In production, generate separate sourcemap files so that bundles appear
split into their original, un-obfuscated source files in browser
devtools.

Note: `source-map` generation on large projects can cause node/v8 to
exhaust its memory allocation (see webpack/webpack#1914,
webpack/webpack#2157). This is the reason for the change to
package.json. In the future (e.g. when Canvas uses Node 8, or the
NODE_OPTIONS feature is back-ported to Node 6, this can go back to
a traditional npm script that doesn't directly invoke `node`.

Test Plan:
- Remove the `public/dist/webpack-*` directories.
- Run `JS_BUILD_NO_UGLIFY=true npm run webpack-production`. No sourcemap
  files should be present in  `public/dist/webpack-production`.
- Run `npm run webpack-production`. Sourcemap files should be present in
  `public/dist/webpack-production`

Change-Id: Iebc85b5f52a6c7c25fdc5c2326cf9436dd42c2dd
Reviewed-on: https://gerrit.instructure.com/128070
Reviewed-by: Ryan Shaw <ryan@instructure.com>
Product-Review: Ryan Shaw <ryan@instructure.com>
Tested-by: Jenkins
Reviewed-by: Simon Williams <simon@instructure.com>
QA-Review: Jeremy Putnam <jeremyp@instructure.com>
This commit is contained in:
Graham Ballantyne 2017-08-26 00:33:18 -06:00 committed by Simon Williams
parent 8dd26aa761
commit 5c9ae8f6aa
2 changed files with 6 additions and 3 deletions

View File

@ -71,8 +71,11 @@ module.exports = {
// In prod build, don't attempt to continue if there are any errors. // In prod build, don't attempt to continue if there are any errors.
bail: process.env.NODE_ENV === 'production', bail: process.env.NODE_ENV === 'production',
// This makes the bundle appear split into separate modules in the devtools in dev/test. // In production, and when not using JS_BUILD_NO_UGLIFY, generate separate sourcemap files.
devtool: process.env.NODE_ENV === 'production' ? undefined : 'eval', // In development, generate `eval` sourcemaps.
devtool: process.env.NODE_ENV === 'production' ?
(process.env.JS_BUILD_NO_UGLIFY ? undefined : 'source-map')
: 'eval',
entry: Object.assign({ entry: Object.assign({
vendor: require('./modulesToIncludeInVendorBundle'), vendor: require('./modulesToIncludeInVendorBundle'),

View File

@ -154,7 +154,7 @@
"webpack": "gulp rev & webpack --progress --color --watch", "webpack": "gulp rev & webpack --progress --color --watch",
"webpack-development": "gulp rev & webpack --progress --color", "webpack-development": "gulp rev & webpack --progress --color",
"webpack-stats": "webpack --profile --json", "webpack-stats": "webpack --profile --json",
"webpack-production": "NODE_ENV=production gulp rev & webpack --color --config webpack.production.config.js", "webpack-production": "NODE_ENV=production gulp rev & node --max_old_space_size=4096 $(yarn bin)/webpack --color --config webpack.production.config.js",
"jspec": "./spec/jspec.sh", "jspec": "./spec/jspec.sh",
"jspec-watch": "./spec/jspec.sh --watch" "jspec-watch": "./spec/jspec.sh --watch"
} }