ShakaCode | ShakaCode Blog | Rails On Maui Blog | Rails | ReactJs | JavaScript | Webpack | Productivity |

Getting an error from babel polyfill that it's already loaded


I’m setting up the consumer facing side of a small app to be server rendered. The server config has the entry points of the babel polyfill, and my registration.js file, which bootstraps the top level react component & redux.

I also have the vendor bundle setup in the base webpack config, which includes the babel polyfill and jQuery. My application.js manifest then includes both the vendor bundle and the server bundle. When i load the page, i then get an error that babel has already been loaded. I’ve tried removing the vendor bundle, but i then need jquery. The vendor bundle is also used by the admin side, which is client rendered. So I do not want to change that either. I looked at the react webpack tutorial, and it has things setup the same way. Any idea what I might be missing?

Gist url: agmcleod/55ead7d082131e3d54ecfcf6ceef26e7. Sorry, but the forum won’t let me link the full URL.


@agmcleod wrote:

My application.js manifest then includes both the vendor bundle and the server bundle.

You should 100% not put your server bundle file in your application.js manifest. That file is sent to the client. Only the server rendering from React on Rails will use the server bundle file.


@justin Hi Justin,

I apologize for not seeing the reply, I must have missed the email.

I removed the server bundle from application.js, and have things running at least. Though the server side runs into an error with how i have react router setup with redux. Gonna poke at it for a while :slight_smile:


I had the same error message when I moved the javascript_include_tag from my header tag to the body tag in my layouts/application.html.erb file. Moving it back appeared to resolve the issue, for me?