Comments (7)
My comment on stack overflow: http://stackoverflow.com/questions/24438996/react-rails-component-with-prerender-true-in-options-hash-gives-a-v8error#comment37857875_24438996
I suspect maybe we have a bug about when we load components.js into the VM. Can anybody test this out?
from react-rails.
I have set up a Runnable with a sample server rendered component, and it is working on react-rails master with Ruby 1.9.3-p194 and TheRubyRacer gem.
http://runnable.com/U87J_K82JzoNLOzT/react-rails-server-rendering-example-for-reactjs
@KurtRMueller Im not sure this is your problem, but the CS file of yours needs to somehow attach AssignmentWindowProgressBar
to the global object (unless you have turned off the protective function wrapper that CS usually uses). In the browser that is window
and in V8 it is global
. So in my example CS I have at the end of my component definition:
window.FancyBox = FancyBox if window?
global.FancyBox = FancyBox if global?
We need some conventions on how to best do this so everything works on client and server. Im sure nodejs has this figured out, how do they do it?
from react-rails.
AFAIK the standard is to wrap the JS file in one huge immediately invoked function and then pass window
or global
to it as a scope
or whatever argument - based on what is undefined
But we have to decide on one system for DI and embrace it everywhere in react-rails!
The problem here is with coffeescript / (c)jsx compilation not with the global scope - putting on my TODO.
from react-rails.
Is there a workaround for this? I got my global scope issue sorted with components.js and global.Component = Component, but I'm now having this V8::Error. Mine is _ is not defined
, which may have something to do with Underscore.js.
Update: I was able to get past that error, but only by requiring the underscore library in components.js. The next errors were related to more libraries referenced in components, and the one I'm stuck on now is Encountered error "ReferenceError: App is not defined" when prerendering...
Are React components supposed to avoid using third party libraries/shared application js code? These components work fine when rendered clientside - is there maybe a better way to give the prerender VM access to the application pipeline javascripts?
from react-rails.
@chellberg I am getting the exact same V8::Error, only with document is not defined
instead of the libraries you are talking about.
Would love to hear if anyone has any insight. Thanks!
from react-rails.
@zkilgore That's one of the ones we ran into - I wanna say it was related to jQuery being unavailable but I'm not 100% sure. The sum of the problems I've encountered makes it seem like the prerenderer is trying to execute the javascript in isolation rather than simulating an actual browser (with a document object, etc) - but then again, I did have to set window.Component = Component
to get to this error, so I guess there's at least a window.
from react-rails.
I hope this issue was worked out! Server rendering is very different now, please open another issue if you're having a problem with it!
from react-rails.
Related Issues (20)
- Update to React 18 for embedded React HOT 2
- Server side rendering broken in 2.7 HOT 2
- `ReactDOM.version?.split` not transpiled? HOT 3
- Can't resolve 'react-dom/client' HOT 3
- Import react_component but it' shown HOT 2
- compare/contrast and migration steps to react_on_rails HOT 5
- Component doesn't render on jsbundling-rails webpacker HOT 5
- Component not loading in rails app HOT 5
- react-rails v3.1.0 is broken HOT 1
- server_rendering.js not found following README HOT 8
- Re-organize documentations in docs folder
- server_rendering.js not found following README HOT 1
- How do I handle styling?
- esbuild HOT 1
- Error related to server_rendering.js not found with SSR HOT 3
- Setup StrictMode for components HOT 2
- get started docs r-r version HOT 1
- Rails 7.1 Renders Partial Header HOT 1
- Server side rendering `window` behaves differently than Node.js? HOT 4
- Issues with Loading React Component for Cuprite in Rails 7.1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from react-rails.