Skip to content

Commit 875d05d

Browse files
authored
Include full error messages in React Native build (#15363)
The React Native build does not minify error messages in production, but it still needs to run the error messages transform to compile `invariant` calls to `ReactError`. To do this, I added a `noMinify` option to the Babel plugin. I also renamed it from `minify-error-messages` to the more generic `transform-error-messages`.
1 parent 1b2159a commit 875d05d

File tree

7 files changed

+61
-32
lines changed

7 files changed

+61
-32
lines changed

scripts/error-codes/README.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,6 @@ provide a better debugging support in production. Check out the blog post
1212
can test it by running `yarn build -- --extract-errors`, but you should only
1313
commit changes to this file when running a release. (The release tool will
1414
perform this step automatically.)
15-
- [`minify-error-codes`](https://github.com/facebook/react/blob/master/scripts/error-codes/minify-error-codes)
15+
- [`transform-error-messages`](https://github.com/facebook/react/blob/master/scripts/error-codes/transform-error-messages)
1616
is a Babel pass that rewrites error messages to IDs for a production
1717
(minified) build.

scripts/error-codes/__tests__/__snapshots__/minify-error-messages.js.snap renamed to scripts/error-codes/__tests__/__snapshots__/transform-error-messages.js.snap

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -94,3 +94,14 @@ import invariant from 'shared/invariant';
9494
}
9595
})();"
9696
`;
97+
98+
exports[`error transform should support noMinify option 1`] = `
99+
"import _ReactError from 'shared/ReactError';
100+
101+
import invariant from 'shared/invariant';
102+
(function () {
103+
if (!condition) {
104+
throw _ReactError(\`Do not override existing functions.\`);
105+
}
106+
})();"
107+
`;

scripts/error-codes/__tests__/minify-error-messages.js renamed to scripts/error-codes/__tests__/transform-error-messages.js

Lines changed: 15 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -8,11 +8,11 @@
88
'use strict';
99

1010
let babel = require('babel-core');
11-
let devExpressionWithCodes = require('../minify-error-messages');
11+
let devExpressionWithCodes = require('../transform-error-messages');
1212

13-
function transform(input) {
13+
function transform(input, options = {}) {
1414
return babel.transform(input, {
15-
plugins: [devExpressionWithCodes],
15+
plugins: [[devExpressionWithCodes, options]],
1616
}).code;
1717
}
1818

@@ -82,4 +82,16 @@ invariant(condition, 'What\\'s up?');
8282
`)
8383
).toMatchSnapshot();
8484
});
85+
86+
it('should support noMinify option', () => {
87+
expect(
88+
transform(
89+
`
90+
import invariant from 'shared/invariant';
91+
invariant(condition, 'Do not override existing functions.');
92+
`,
93+
{noMinify: true}
94+
)
95+
).toMatchSnapshot();
96+
});
8597
});

scripts/error-codes/minify-error-messages.js renamed to scripts/error-codes/transform-error-messages.js

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,6 +19,7 @@ module.exports = function(babel) {
1919
visitor: {
2020
CallExpression(path, file) {
2121
const node = path.node;
22+
const noMinify = file.opts.noMinify;
2223
if (path.get('callee').isIdentifier({name: 'invariant'})) {
2324
// Turns this code:
2425
//
@@ -66,7 +67,7 @@ module.exports = function(babel) {
6667
const errorMap = invertObject(existingErrorMap);
6768

6869
let prodErrorId = errorMap[errorMsgLiteral];
69-
if (prodErrorId === undefined) {
70+
if (prodErrorId === undefined || noMinify) {
7071
// There is no error code for this message. We use a lint rule to
7172
// enforce that messages can be minified, so assume this is
7273
// intentional and exit gracefully.

scripts/jest/preprocessor.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,7 @@ const pathToBabel = path.join(
1515
'package.json'
1616
);
1717
const pathToBabelPluginDevWithCode = require.resolve(
18-
'../error-codes/minify-error-messages'
18+
'../error-codes/transform-error-messages'
1919
);
2020
const pathToBabelPluginWrapWarning = require.resolve(
2121
'../babel/wrap-warning-with-env-check'

scripts/rollup/build.js

Lines changed: 7 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -113,7 +113,7 @@ function getBabelConfig(updateBabelOptions, bundleType, filename) {
113113
return Object.assign({}, options, {
114114
plugins: options.plugins.concat([
115115
// Minify invariant messages
116-
require('../error-codes/minify-error-messages'),
116+
require('../error-codes/transform-error-messages'),
117117
// Wrap warning() calls in a __DEV__ check so they are stripped from production.
118118
require('../babel/wrap-warning-with-env-check'),
119119
]),
@@ -126,6 +126,11 @@ function getBabelConfig(updateBabelOptions, bundleType, filename) {
126126
case RN_FB_PROFILING:
127127
return Object.assign({}, options, {
128128
plugins: options.plugins.concat([
129+
[
130+
require('../error-codes/transform-error-messages'),
131+
// Preserve full error messages in React Native build
132+
{noMinify: true},
133+
],
129134
// Wrap warning() calls in a __DEV__ check so they are stripped from production.
130135
require('../babel/wrap-warning-with-env-check'),
131136
]),
@@ -141,7 +146,7 @@ function getBabelConfig(updateBabelOptions, bundleType, filename) {
141146
// Use object-assign polyfill in open source
142147
path.resolve('./scripts/babel/transform-object-assign-require'),
143148
// Minify invariant messages
144-
require('../error-codes/minify-error-messages'),
149+
require('../error-codes/transform-error-messages'),
145150
// Wrap warning() calls in a __DEV__ check so they are stripped from production.
146151
require('../babel/wrap-warning-with-env-check'),
147152
]),

scripts/rollup/results.json

Lines changed: 24 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -578,57 +578,57 @@
578578
"filename": "ReactNativeRenderer-dev.js",
579579
"bundleType": "RN_FB_DEV",
580580
"packageName": "react-native-renderer",
581-
"size": 645983,
582-
"gzip": 137694
581+
"size": 720540,
582+
"gzip": 154199
583583
},
584584
{
585585
"filename": "ReactNativeRenderer-prod.js",
586586
"bundleType": "RN_FB_PROD",
587587
"packageName": "react-native-renderer",
588-
"size": 252030,
589-
"gzip": 44064
588+
"size": 252865,
589+
"gzip": 44240
590590
},
591591
{
592592
"filename": "ReactNativeRenderer-dev.js",
593593
"bundleType": "RN_OSS_DEV",
594594
"packageName": "react-native-renderer",
595-
"size": 645895,
596-
"gzip": 137660
595+
"size": 720452,
596+
"gzip": 154169
597597
},
598598
{
599599
"filename": "ReactNativeRenderer-prod.js",
600600
"bundleType": "RN_OSS_PROD",
601601
"packageName": "react-native-renderer",
602-
"size": 252044,
603-
"gzip": 44061
602+
"size": 252879,
603+
"gzip": 44238
604604
},
605605
{
606606
"filename": "ReactFabric-dev.js",
607607
"bundleType": "RN_FB_DEV",
608608
"packageName": "react-native-renderer",
609-
"size": 634566,
610-
"gzip": 134983
609+
"size": 709123,
610+
"gzip": 151511
611611
},
612612
{
613613
"filename": "ReactFabric-prod.js",
614614
"bundleType": "RN_FB_PROD",
615615
"packageName": "react-native-renderer",
616-
"size": 245276,
617-
"gzip": 42773
616+
"size": 246002,
617+
"gzip": 42956
618618
},
619619
{
620620
"filename": "ReactFabric-dev.js",
621621
"bundleType": "RN_OSS_DEV",
622622
"packageName": "react-native-renderer",
623-
"size": 634470,
624-
"gzip": 134930
623+
"size": 709027,
624+
"gzip": 151463
625625
},
626626
{
627627
"filename": "ReactFabric-prod.js",
628628
"bundleType": "RN_OSS_PROD",
629629
"packageName": "react-native-renderer",
630-
"size": 245282,
631-
"gzip": 42767
630+
"size": 246008,
631+
"gzip": 42950
632632
},
633633
{
634634
"filename": "ReactTestRenderer-dev.js",
@@ -725,15 +725,15 @@
725725
"filename": "ReactNativeRenderer-profiling.js",
726726
"bundleType": "RN_OSS_PROFILING",
727727
"packageName": "react-native-renderer",
728-
"size": 258447,
729-
"gzip": 45443
728+
"size": 259040,
729+
"gzip": 45588
730730
},
731731
{
732732
"filename": "ReactFabric-profiling.js",
733733
"bundleType": "RN_OSS_PROFILING",
734734
"packageName": "react-native-renderer",
735-
"size": 250755,
736-
"gzip": 44122
735+
"size": 251432,
736+
"gzip": 44320
737737
},
738738
{
739739
"filename": "Scheduler-dev.js",
@@ -774,15 +774,15 @@
774774
"filename": "ReactNativeRenderer-profiling.js",
775775
"bundleType": "RN_FB_PROFILING",
776776
"packageName": "react-native-renderer",
777-
"size": 258428,
778-
"gzip": 45445
777+
"size": 259021,
778+
"gzip": 45590
779779
},
780780
{
781781
"filename": "ReactFabric-profiling.js",
782782
"bundleType": "RN_FB_PROFILING",
783783
"packageName": "react-native-renderer",
784-
"size": 250744,
785-
"gzip": 44126
784+
"size": 251421,
785+
"gzip": 44324
786786
},
787787
{
788788
"filename": "react.profiling.min.js",

0 commit comments

Comments
 (0)