feat(babel-plugin-react-intl): add outputEmptyJson option

This will suppress writing out empty files if file has no messages

Author: Long Ho

packages/babel-plugin-react-intl/README.md

@@ -61,6 +61,8 @@ If a message descriptor has a `description`, it'll be removed from the source af
 
 - **`extractFromFormatMessageCall`**: Opt-in to extract from `intl.formatMessage` call with the same restrictions, e.g: has to be called with object literal such as `intl.formatMessage({ id: 'foo', defaultMessage: 'bar', description: 'baz'})`
 
+- **`outputEmptyJson`**: output file with empty `[]` if src has no messages. For build systems like bazel that relies on specific output mapping, not writing out a file can cause issues.
+
 ### Via Node API
 
 The extract message descriptors are available via the `metadata` property on the object returned from Babel's `transform()` API:

packages/babel-plugin-react-intl/src/index.ts

@@ -302,7 +302,7 @@ export default declare((api: any, options: OptionsSchema) => {
     name: 'babel-plugin-react-intl',
     baseDataPath: 'options',
   });
-  const {messagesDir} = options;
+  const {messagesDir, outputEmptyJson} = options;
 
   /**
    * Store this in the node itself so that multiple passes work. Specifically
@@ -341,7 +341,7 @@ export default declare((api: any, options: OptionsSchema) => {
       const descriptors = Array.from(messages.values());
       state.metadata['react-intl'] = {messages: descriptors};
 
-      if (basename && messagesDir) {
+      if (basename && messagesDir && (outputEmptyJson || descriptors.length)) {
         // Make sure the relative path is "absolute" before
         // joining it with the `messagesDir`.
         let relativePath = p.join(p.sep, p.relative(process.cwd(), filename));

packages/babel-plugin-react-intl/src/options.schema.json

@@ -10,7 +10,8 @@
     },
     "removeDefaultMessage": {"type": "boolean"},
     "extractFromFormatMessageCall": {"type": "boolean"},
-    "additionalComponentNames": {"type": "array", "items": {"type": "string"}}
+    "additionalComponentNames": {"type": "array", "items": {"type": "string"}},
+    "outputEmptyJson": {"type": "boolean"}
   },
   "additionalProperties": false
 }

packages/babel-plugin-react-intl/src/options.ts

@@ -13,4 +13,5 @@ export interface OptionsSchema {
   removeDefaultMessage?: boolean;
   extractFromFormatMessageCall?: boolean;
   additionalComponentNames?: string[];
+  outputEmptyJson?: boolean;
 }

packages/babel-plugin-react-intl/test/__snapshots__/index.test.ts.snap

@@ -270,40 +270,6 @@ Array [
 ]
 `;
 
-exports[`emit asserts for:  output match: empty 1`] = `
-Object {
-  "messages": Array [],
-}
-`;
-
-exports[`emit asserts for:  output match: empty 2`] = `
-"\\"use strict\\";
-
-Object.defineProperty(exports, \\"__esModule\\", {
-  value: true
-});
-exports.default = void 0;
-
-var _react = _interopRequireWildcard(require(\\"react\\"));
-
-var _macro = require(\\"@formatjs/macro\\");
-
-function _getRequireWildcardCache() { if (typeof WeakMap !== \\"function\\") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
-
-function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== \\"object\\" && typeof obj !== \\"function\\") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
-class Foo extends _react.Component {
-  render() {
-    return _react.default.createElement(\\"div\\", null);
-  }
-
-}
-
-exports.default = Foo;"
-`;
-
-exports[`emit asserts for:  output match: empty 3`] = `Array []`;
-
 exports[`emit asserts for:  output match: enforceDefaultMessage 1`] = `
 Object {
   "messages": Array [
@@ -586,6 +552,34 @@ Array [
 ]
 `;
 
+exports[`options outputEmptyJson should output empty files 1`] = `
+"\\"use strict\\";
+
+Object.defineProperty(exports, \\"__esModule\\", {
+  value: true
+});
+exports.default = void 0;
+
+var _react = _interopRequireWildcard(require(\\"react\\"));
+
+var _macro = require(\\"@formatjs/macro\\");
+
+function _getRequireWildcardCache() { if (typeof WeakMap !== \\"function\\") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
+
+function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== \\"object\\" && typeof obj !== \\"function\\") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+class Foo extends _react.Component {
+  render() {
+    return _react.default.createElement(\\"div\\", null);
+  }
+
+}
+
+exports.default = Foo;"
+`;
+
+exports[`options outputEmptyJson should output empty files 2`] = `Array []`;
+
 exports[`options removeDefaultMessage should remove default message 1`] = `
 "\\"use strict\\";
 
@@ -702,3 +696,29 @@ Array [
   },
 ]
 `;
+
+exports[`options without outputEmptyJson should output empty files 1`] = `
+"\\"use strict\\";
+
+Object.defineProperty(exports, \\"__esModule\\", {
+  value: true
+});
+exports.default = void 0;
+
+var _react = _interopRequireWildcard(require(\\"react\\"));
+
+var _macro = require(\\"@formatjs/macro\\");
+
+function _getRequireWildcardCache() { if (typeof WeakMap !== \\"function\\") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
+
+function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== \\"object\\" && typeof obj !== \\"function\\") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+class Foo extends _react.Component {
+  render() {
+    return _react.default.createElement(\\"div\\", null);
+  }
+
+}
+
+exports.default = Foo;"
+`;

packages/babel-plugin-react-intl/test/fixtures/outputEmptyJson/actual.js

@@ -0,0 +1,8 @@
+import React, {Component} from 'react';
+import {_} from '@formatjs/macro';
+
+export default class Foo extends Component {
+  render() {
+    return <div></div>;
+  }
+}

packages/babel-plugin-react-intl/test/index.test.ts

@@ -19,6 +19,8 @@ const skipOutputTests = [
   'overrideIdFn',
   'removeDefaultMessage',
   'additionalComponentNames',
+  'outputEmptyJson',
+  'empty',
 ];
 
 const fixturesDir = join(__dirname, 'fixtures');
@@ -62,6 +64,30 @@ describe('options', () => {
     // Check message output
     expect(require(join(fixtureDir, 'actual.json'))).toMatchSnapshot();
   });
+  it('outputEmptyJson should output empty files', function() {
+    const fixtureDir = join(fixturesDir, 'outputEmptyJson');
+
+    const actual = transform(join(fixtureDir, 'actual.js'), {
+      outputEmptyJson: true,
+    })!.code;
+
+    // Check code output
+    expect(trim(actual)).toMatchSnapshot();
+
+    // Check message output
+    expect(require(join(fixtureDir, 'actual.json'))).toMatchSnapshot();
+  });
+  it('without outputEmptyJson should output empty files', function() {
+    const fixtureDir = join(fixturesDir, 'empty');
+
+    const actual = transform(join(fixtureDir, 'actual.js'), {})!.code;
+
+    // Check code output
+    expect(trim(actual)).toMatchSnapshot();
+
+    // Check message output
+    expect(fs.existsSync(join(fixtureDir, 'actual.json'))).toBeFalsy();
+  });
   it('correctly overrides the id when overrideIdFn is provided', () => {
     const fixtureDir = join(fixturesDir, 'overrideIdFn');