TypeError: comments is not iterable

[AlicanC]

Bug Report

Current Behavior
When building a React Native application with Metro, @babel/plugin-transform-flow-strip-types throws TypeError: comments is not iterable. When that is fixed, @babel/plugin-transform-react-jsx starts throwing TypeError: file.ast.comments is not iterable.

An occurrence of this problem can be found here: react-navigation/react-navigation#4983

Input Code
This PNG file: https://github.com/react-navigation/react-navigation/blob/22926c52303da8f329c4b130cb1bbe606eb7d74c/src/views/assets/back-icon.png

Expected behavior/code
Expected not to error.

Babel Configuration (.babelrc, package.json, cli command)

/* @flow */

module.exports = {
  presets: ['module:metro-react-native-babel-preset'],
  plugins: ['@babel/plugin-transform-runtime', 'relay'],
  env: {
    test: {
      plugins: ['transform-es2015-modules-commonjs'],
    },
  },
};

Environment

• Babel version(s): v7.0.0
• Node/npm version: v8.11.3
• OS: macOS 10.13.6
• Monorepo no
• How you are using Babel: Metro Bundler

Possible Solution
PR #8701

[babel-bot]

Hey @AlicanC! We really appreciate you taking the time to report an issue. The collaborators
on this project attempt to help as many people as possible, but we're a limited number of volunteers,
so it's possible this won't be addressed swiftly.

If you need any help, or just have general Babel or JavaScript questions, we have a vibrant Slack
community that typically always has someone willing to help. You can sign-up here
for an invite.

[swcisel]

I've encountered exactly this issue and can confirm that adding checks for Array.isArray(comments) and Array.isArray(file.ast.comments) to plugin-transform-flow-strip-types and plugin-transform-react-jsx fixes the issue. Here's my babel.config.js:

module.exports = {
  presets: ["module:metro-react-native-babel-preset"],
  plugins: [
    ["@babel/plugin-proposal-decorators", { legacy: true }],
    [
      "@babel/transform-runtime",
      {
        regenerator: false
      }
    ]
  ]
};

It's also worth noting that the following causes the same error on back-icon-mask.png:

<Image
   source={require('../assets/back-icon-mask.png')}
   style={styles.iconMask}
/>

As mentioned here, adding exclude: ['**/*.png', '...'] to babel.config.js also corrects the error.

[helenaford]

@swcisel mentioned comment exclude: ['**/*.png', '...'] works like a charm