server_rendering.js not found following README

[paul-mesnilgrente]

Steps to reproduce

I simply followed the https://github.com/reactjs/react-rails#get-started-with-shakapacker to the letter with one commit per step. The result is on this repo: https://github.com/paul-mesnilgrente/react-rails-shakapacker-bug

Expected behavior

The server side rendering is working

Actual behavior

Server-side rendering should not throw this error:

ActionView::Template::Error (No such file or directory @ rb_sysopen - /home/paul/Dev/blog-v2/public/packs/server_rendering.js)

System configuration

• Shakapacker or Sprockets version: Shapacker 7.0.3
• React-Rails version: 3.1.1
• React_UJS version: 3.1.1
• Rails version: 7.0.8
• Ruby version: 3.0.3

---

The server-side rendering does not work, if I turn it off, everything's fine.

[ahangarha]

Please follow https://github.com/reactjs/react-rails#server-side-rendering instructions for webpack config.

[paul-mesnilgrente]

Thanks for your answer but what am I supposed to look at? I followed the README setup and so I used all the defaults which are described by what you pointed me at.

I tried a few different paths on config.react.server_renderer_directories just in case. But the issue remains:

ActionView::Template::Error (No such file or directory @ rb_sysopen - /home/paul/Dev/blog/public/packs/server_rendering.js)

[ahangarha]

@paul-mesnilgrente I mean this part in particular:

react-rails must load your code. By convention, it uses server_rendering.js, which was created by the install task. This file must include your components and their dependencies (eg, Underscore.js).
Requires separate compilations for server & client bundles (see Webpack config)

[paul-mesnilgrente]

Ok, the step 4 'Install react-rails' in the README.md: https://github.com/reactjs/react-rails#get-started-with-shakapacker tells you to run rails generate react:install which is generating the server_rendering.js file which has this content:

// By default, this pack is loaded for server-side rendering.
// It must expose react_ujs as `ReactRailsUJS` and prepare a require context.
var componentRequireContext = require.context("components", true);
var ReactRailsUJS = require("react_ujs");
ReactRailsUJS.useContext(componentRequireContext);

You will find it on the dummy repository I provided: https://github.com/paul-mesnilgrente/react-rails-shakapacker-bug/blob/main/app/javascript/packs/server_rendering.js

So that's not the problem, unfortunately, any other ideas?

[ahangarha]

That is not enough. You need to make separate webpack configurations for client and server. Please follow the instruction and share the result.

[paul-mesnilgrente]

Alright, I understand the confusion. The rails generate react-rails:install gives you a server_rendering.js but it's not actually working as is. It feels like the tool should provide an extra step like rails generate react-rails:install-ssr and make it clearer in the docs.

I copied the webpack config files across from the dummy app and the server error keeps happening (I pushed the changes to the repo I provided). I read all the docs but unfortunately, I can't find what I am doing wrong. What's the next step?

[ahangarha]

I will check your repo soon.

CC @Judahmeek @justin808 regarding the generator behavior.

[Judahmeek]

@paul-mesnilgrente Sorry for the confusion.

I believe the last bit you're missing is that, having updated your shakapacker configuration, you'll need to run bin/shakapacker to compile the server-bundle (SERVER_BUNDLE_ONLY=yes bin/shakapacker if you want to compile ONLY the server bundle).

bin/shakapacker-dev-server only compiles client-code.

Generally, the easiest way to compile both server & client bundles at the same time is to use a Procfile and then run it with either Foreman or Overmind

Multiple terminal tabs work just as well though...