Create-react-app: Minification bug in production build that does not exist when using dev server

[stahlmanDesign]

Describe the bug

I tracked down the bug to a return statement that the minifier resolved to return null/nothing, but the dev server returned a component as expected.

Environment

CRA not ejected
react-scripts 3.4.1

bug seen in Firefox, Safari and Chrome on Mac and PC

Steps to reproduce

class arrow function:

renderOption = (option)=>{
  const { wi } = this.props
    let sourceWi = wi
    return (
      // myVar1,
      // myVar2,
      // myVar3
      <MyComponent
        title={ sourceWi.title }
        revIndex={ option.revIndex }
        sourceWi={ sourceWi }
      />
    )
}

After npm run build, this code no longer returns a component.

Expected behavior

Arrow function should return MyComponent (which works fine using dev server)

Actual behavior

After running npm run build, it appears the minifier returns nothing. Even though the return statement wraps its content in parentheses (). Perhaps it is confused by the commented variables //

I corrected the bug by creating a variable and then returning it:

renderOption = (option)=>{
  const { wi } = this.props
    let sourceWi = wi
    const res = (
      // myVar1,
      // myVar2,
      // myVar3
      <MyComponent
        title={ sourceWi.title }
        revIndex={ option.revIndex }
        sourceWi={ sourceWi }
      />
    )
    return res // NOTE returning the const res instead of the parentheses builds and runs fine
}

To reproduce the behaviour of the bug I simply return nothing instead of res. This is why I think it is a minification problem that ignores the contents inside the parentheses.

[sbusch]

See also #8687

[stale[bot]]

This issue has been automatically marked as stale because it has not had any recent activity. It will be closed in 5 days if no further activity occurs.

[sbusch]

I dont think this is resolved, see other issues

[sbusch]

Update: see my comment here https://github.com/facebook/create-react-app/issues/8687#issuecomment-646764708

[stale[bot]]

This issue has been automatically marked as stale because it has not had any recent activity. It will be closed in 5 days if no further activity occurs.

[stahlmanDesign]

I see a lot of people saying:

• "removing comments fixes it"
• "the error is resolved when I remove a comment".
  Technically removing valid code is a _workaround_. The minification script in Babel or Webpack still needs to be resolved so that people writing valid code don't end up with errors.

[stale[bot]]

This issue has been automatically marked as stale because it has not had any recent activity. It will be closed in 5 days if no further activity occurs.

[stahlmanDesign]

This issue is still open and it's due to webpack / babel

[stale[bot]]

This issue has been automatically marked as stale because it has not had any recent activity. It will be closed in 5 days if no further activity occurs.

[stale[bot]]

This issue has been automatically closed because it has not had any recent activity. If you have a question or comment, please open a new issue.