Please add support for Babel 6.0 #193

Closed
aeleftheriadis opened this Issue Nov 13, 2015 · 6 comments

Projects

None yet

4 participants

@aeleftheriadis

Since the release of Babel 6 the package doesn't work with webpack example.

I receive the following error on my browser

Error while rendering "Components.HelloWorld" to "react1": Error: Invariant Violation: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: object.
at invariant (Script Document [2]:20215:15) -> throw error;
at instantiateReactComponent (Script Document [2]:18233:127)
at Script Document [2]:13840:31
at Mixin.perform (Script Document [2]:17235:20)
at renderToString (Script Document [2]:13839:24)
at newFn (Script Document [2]:17611:17)
at Script Document [8] [temp]:1:7
Line: 20215
Column:15

My component name is apparently HelloWorld.
I have added inside .babelrc the following
{
"presets": ["es2015", "react"]
}

Among others I have included the following packages
"babel-preset-es2015": "^6.1.18",
"babel-preset-react": "^6.1.18",
"babel-core": "^6.1.20",
"babel-loader": "^6.1.0"

My workaround is to work with latest babel 5.0 version where everything work fine

@Daniel15
Member

I started working on native Babel 6 support in ReactJS.NET, but I'm currently blocked by https://phabricator.babeljs.io/T6643

@drobinson-inter-est

Should this not be considered a bug? Also, are we likely to see a fix for it anytime soon? My entire rationale for using the React.NET integration was to give me server-side rendering within the .NET stack.

I'm currently in the opening phases of build a new tech stack - If I can't guarantee that this issue will be resolved in the short term, then I'm going to have to strip out the .NET and go with a different solution. Some feedback on the likelihood of this would be appreciated.

@jslatts
Contributor
jslatts commented Nov 30, 2015

As @aeleftheriadis mentioned, it works fine with Babel 5. You can also just avoid doing any JSX compiling in React.NET and use any external tools (Browserify, webpack, babel, etc) to do your JS compile stage and then use AddScriptWithoutTransform to bypass React.NET's transformation step.

You will probably end up wanting to do your own compile anyway so you have the control over your build as your project progresses (minification, sourcemaps, etc).

@Daniel15
Member

Should this not be considered a bug?

It's not a bug, because Babel 5 works fine. There's a bunch of changes in Babel 6 that I need to adapt ReactJS.NET to handle. Babel no longer has a "browser" build so I need to build my own build of Babel. Many of the Babel integrations are still using Babel 5, as is the "try now" page on their site.

Also, are we likely to see a fix for it anytime soon?

Depends on how quickly I can determine how to get Babel 6 working. I'm the only developer on ReactJS.NET. I do appreciate pull requests though, in case anyone implements it before I get to it 😄

In the meantime, you can just use Babel 5, which works fine.

@drobinson-inter-est

I'm already pointing at compiled JS, @jslatts.

@Daniel15 Thanks for the prompt response - I'm going to shelve .NET server-side processing for now and wait for the update, as I'm just building boilerplate at the moment and it isn't currently a priority: I also don't want to have to make the webpack.config.js file I've been working on work for React, es2015, postcss, tape.js etc on Babel 5 if I can help it.

I'll revisit this, and resolve it, in a few weeks time.

@Daniel15 Daniel15 closed this in d0b14d3 Dec 6, 2015
@Daniel15
Member
Daniel15 commented Dec 6, 2015

I just committed d0b14d3, which upgrades to Babel 6. It should be available on the development NuGet server soon as version 2.2.0-dev.

@drobinson-inter-est - Note that if you're already precompiling your JavaScript, your issues probably aren't related to the version of Babel bundled by ReactJS.NET (as Babel is not even loaded at runtime if you don't compile your JS using ReactJS.NET). It might be a different issue :)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment