From 1587d63be43f13bdcca6797c7ed1a16c1de72f07 Mon Sep 17 00:00:00 2001 From: Joe Haddad Date: Thu, 27 Sep 2018 09:08:27 -0400 Subject: [PATCH 1/2] Output CSS sourcemaps in separate file --- packages/react-scripts/config/webpack.config.prod.js | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/packages/react-scripts/config/webpack.config.prod.js b/packages/react-scripts/config/webpack.config.prod.js index 87b61980eac..29aa3d30f3c 100644 --- a/packages/react-scripts/config/webpack.config.prod.js +++ b/packages/react-scripts/config/webpack.config.prod.js @@ -158,7 +158,10 @@ module.exports = { sourceMap: shouldUseSourceMap, }), new OptimizeCSSAssetsPlugin({ - cssProcessorOptions: { parser: safePostCssParser }, + cssProcessorOptions: { + parser: safePostCssParser, + map: { inline: false, annotation: true }, + }, }), ], // Automatically split vendor and commons From a44f0b3181c939a2a793a8659c6cc4ffbe76f9bd Mon Sep 17 00:00:00 2001 From: Joe Haddad Date: Thu, 27 Sep 2018 09:12:46 -0400 Subject: [PATCH 2/2] explain options --- packages/react-scripts/config/webpack.config.prod.js | 9 ++++++++- 1 file changed, 8 insertions(+), 1 deletion(-) diff --git a/packages/react-scripts/config/webpack.config.prod.js b/packages/react-scripts/config/webpack.config.prod.js index 29aa3d30f3c..8fe4f6189c6 100644 --- a/packages/react-scripts/config/webpack.config.prod.js +++ b/packages/react-scripts/config/webpack.config.prod.js @@ -160,7 +160,14 @@ module.exports = { new OptimizeCSSAssetsPlugin({ cssProcessorOptions: { parser: safePostCssParser, - map: { inline: false, annotation: true }, + map: { + // `inline: false` forces the sourcemap to be output into a + // separate file + inline: false, + // `annotation: true` appends the sourceMappingURL to the end of + // the css file, helping the browser find the sourcemap + annotation: true, + }, }, }), ],