Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Production build breaks code that works in development #126

Closed
modernserf opened this issue Jul 23, 2016 · 14 comments
Closed

Production build breaks code that works in development #126

modernserf opened this issue Jul 23, 2016 · 14 comments

Comments

@modernserf
Copy link

modernserf commented Jul 23, 2016

import React from "react"

export default class App extends React.Component {
  render() {
    return (
      <div>
        <p>Parent</p>
        <AppItem />
      </div>
    )
  }
}

const AppItem = () => {
    return <div>child</div>
}

Works with npm start
Breaks with npm build, giving Element type is invalid error

If you rearrange the code so that AppItem is defined before App (or you use a hoisted function declaration) it works in both environments.

I suspect this has something to do with the react inline elements transformer?

@fbarrailla
Copy link

It seems to be because of babel-plugin-transform-react-constant-elements

@gaearon
Copy link
Contributor

gaearon commented Jul 25, 2016

@hzoo Does this look like a Babel bug to you? Worth filing an issue?

@hzoo
Copy link

hzoo commented Jul 25, 2016

Yeah seems like it, can look at it later - looks like https://phabricator.babeljs.io/T6878, https://phabricator.babeljs.io/T7126

@sebmck
Copy link

sebmck commented Jul 26, 2016

I can fix this.

@sebmck
Copy link

sebmck commented Jul 26, 2016

I fixed this. babel/babel#3596

@gaearon
Copy link
Contributor

gaearon commented Jul 26, 2016

🐈

@sebmck
Copy link

sebmck commented Jul 27, 2016

PR merged. I guess this can be closed.

@gaearon
Copy link
Contributor

gaearon commented Jul 27, 2016

We pin versions so I’d like to leave it open for posterity until we pin to the version fixing this.

@sebmck
Copy link

sebmck commented Jul 27, 2016

The fix is in a transitive dependecy so users will get the updated version regardless and you have no version to update as it's not a direct dependency.

@gaearon
Copy link
Contributor

gaearon commented Jul 27, 2016

We use bundledDependencies, I’m not sure whether this complicates the issue or not..

Copy link
Contributor

Jul 27, 2016

Seems like having to watch your deps more closely and releasing more often to get dep fixes out might be an implicit tradeoff for the single download and version stability from deduping and bundling all your deps.

Just did a fresh install of react-scripts and got exactly what was bundled:

https://npmcdn.com/[email protected]/node_modules/babel-runtime/package.json

@hzoo
Copy link

hzoo commented Jul 27, 2016

Released v6.12.0 with this fix https://github.com/babel/babel/releases/tag/v6.12.0 (and like @kittens said it's a fix in the babel-traverse pkg)

@gaearon
Copy link
Contributor

gaearon commented Jul 27, 2016

Thank you so much! I’ll be using these for next release.
Since we can’t pin a transitive anyway (lol I don’t know npm), I’m closing.

@gaearon gaearon closed this as completed Jul 27, 2016
@gaearon gaearon added this to the 0.2.0 milestone Jul 27, 2016
@gaearon
Copy link
Contributor

gaearon commented Jul 27, 2016

This should be fixed in latest alpha. Please give it a try and let us know. #190

@lock lock bot locked and limited conversation to collaborators Jan 23, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
Development

No branches or pull requests

7 participants