diff --git a/Gemfile b/Gemfile
index e95b5c36..fbe3439d 100644
--- a/Gemfile
+++ b/Gemfile
@@ -37,7 +37,7 @@ gem "sdoc", group: :doc
# Use Rails Html Sanitizer for HTML sanitization
gem "rails-html-sanitizer"
-gem "react_on_rails"
+gem "react_on_rails", "2.0.0.rc.4"
# See https://github.com/sstephenson/execjs#readme for more supported runtimes
gem "therubyracer"
diff --git a/Gemfile.lock b/Gemfile.lock
index e2f298eb..69f158d1 100644
--- a/Gemfile.lock
+++ b/Gemfile.lock
@@ -201,10 +201,11 @@ GEM
rainbow (2.0.0)
rake (10.4.2)
rdoc (4.2.0)
- react_on_rails (1.2.0)
+ react_on_rails (2.0.0.rc.4)
connection_pool
execjs (~> 2.5)
rails (>= 3.2)
+ rainbow (~> 2.0)
ref (2.0.0)
rest-client (1.8.0)
http-cookie (>= 1.0.2, < 2.0)
@@ -346,7 +347,7 @@ DEPENDENCIES
rails-html-sanitizer
rails_12factor
rainbow
- react_on_rails
+ react_on_rails (= 2.0.0.rc.4)
rspec-rails
rspec-retry
rubocop
@@ -364,4 +365,4 @@ DEPENDENCIES
web-console
BUNDLED WITH
- 1.10.6
+ 1.11.2
diff --git a/app/assets/javascripts/application_dev.js b/app/assets/javascripts/application_dev.js
index 45981e68..d5552a07 100644
--- a/app/assets/javascripts/application_dev.js
+++ b/app/assets/javascripts/application_dev.js
@@ -17,7 +17,4 @@
// This one depends on jQuery
//= require turbolinks
-// This will soon be removed as it will be in vendor-bundle with react_on_rails 2.0
-//= require react_on_rails
-
//= require rails_startup
diff --git a/app/controllers/pages_controller.rb b/app/controllers/pages_controller.rb
index 585ee068..03ba0a7b 100644
--- a/app/controllers/pages_controller.rb
+++ b/app/controllers/pages_controller.rb
@@ -7,7 +7,7 @@ def index
# app/views/pages/index.html.erb:20
#
# <%= react_component('App', render(template: "/comments/index.json.jbuilder"),
- # generator_function: true, prerender: true) %>
+ # prerender: true) %>
#
#
# NOTE: this could be an alternate syntax if you wanted to pass comments as a variable to a partial
diff --git a/app/views/pages/index.html.erb b/app/views/pages/index.html.erb
index 5aceab01..bed28134 100644
--- a/app/views/pages/index.html.erb
+++ b/app/views/pages/index.html.erb
@@ -3,4 +3,4 @@
<%= render "header" %>
<%= react_component('RouterApp', render(template: "/comments/index.json.jbuilder"),
- generator_function: true, prerender: true, raise_on_prerender_error: true) %>
+ prerender: true, raise_on_prerender_error: true) %>
diff --git a/app/views/pages/no_router.html.erb b/app/views/pages/no_router.html.erb
index 4537ac8b..27d92631 100644
--- a/app/views/pages/no_router.html.erb
+++ b/app/views/pages/no_router.html.erb
@@ -3,4 +3,4 @@
<%= render "header" %>
<%= react_component('App', render(template: "/comments/index.json.jbuilder"),
- generator_function: true, prerender: false) %>
+ prerender: false) %>
diff --git a/app/views/pages/simple.html.erb b/app/views/pages/simple.html.erb
index 40691d22..81e85343 100644
--- a/app/views/pages/simple.html.erb
+++ b/app/views/pages/simple.html.erb
@@ -9,4 +9,4 @@
-<%= react_component('SimpleCommentScreen', {}, generator_function: false, prerender: false) %>
+<%= react_component('SimpleCommentScreen', {}, prerender: false) %>
diff --git a/client/app/bundles/comments/startup/clientGlobals.jsx b/client/app/bundles/comments/startup/clientRegistration.jsx
similarity index 56%
rename from client/app/bundles/comments/startup/clientGlobals.jsx
rename to client/app/bundles/comments/startup/clientRegistration.jsx
index ce05dbd5..f3ecc0d0 100644
--- a/client/app/bundles/comments/startup/clientGlobals.jsx
+++ b/client/app/bundles/comments/startup/clientRegistration.jsx
@@ -1,7 +1,12 @@
import App from './ClientApp';
import RouterApp from './ClientRouterApp';
import SimpleCommentScreen from '../components/SimpleCommentScreen/SimpleCommentScreen';
+import ReactOnRails from 'react-on-rails';
-window.App = App;
-window.RouterApp = RouterApp;
-window.SimpleCommentScreen = SimpleCommentScreen;
+ReactOnRails.register(
+ {
+ App,
+ RouterApp,
+ SimpleCommentScreen,
+ }
+);
diff --git a/client/app/bundles/comments/startup/serverGlobals.jsx b/client/app/bundles/comments/startup/serverGlobals.jsx
deleted file mode 100644
index cb825b2e..00000000
--- a/client/app/bundles/comments/startup/serverGlobals.jsx
+++ /dev/null
@@ -1,9 +0,0 @@
-// Example of React + Redux
-// Shows the mapping from the exported object to the name used by the server rendering.
-import App from './ServerApp';
-import RouterApp from './ServerRouterApp';
-
-// We can use the node global object for exposing.
-// NodeJs: https://nodejs.org/api/globals.html#globals_global
-global.App = App;
-global.RouterApp = RouterApp;
diff --git a/client/app/bundles/comments/startup/serverRegistration.jsx b/client/app/bundles/comments/startup/serverRegistration.jsx
new file mode 100644
index 00000000..8a7d4eaa
--- /dev/null
+++ b/client/app/bundles/comments/startup/serverRegistration.jsx
@@ -0,0 +1,11 @@
+// Example of React + Redux
+import App from './ServerApp';
+import RouterApp from './ServerRouterApp';
+import ReactOnRails from 'react-on-rails';
+
+ReactOnRails.register(
+ {
+ App,
+ RouterApp,
+ }
+);
diff --git a/client/index.jade b/client/index.jade
index 6df9ea4f..bb7c6899 100644
--- a/client/index.jade
+++ b/client/index.jade
@@ -11,4 +11,4 @@ html
script(src="vendor-bundle.js")
script(src="app-bundle.js")
script.
- ReactDOM.render(RouterApp(!{props}), document.getElementById('app'));
+ ReactOnRails.render("RouterApp", !{props}, 'app');
diff --git a/client/npm-shrinkwrap.json b/client/npm-shrinkwrap.json
index 81489068..eb9397db 100644
--- a/client/npm-shrinkwrap.json
+++ b/client/npm-shrinkwrap.json
@@ -4074,6 +4074,10 @@
"from": "react-dom@>=0.14.3 <0.15.0",
"resolved": "https://registry.npmjs.org/react-dom/-/react-dom-0.14.5.tgz"
},
+ "react-on-rails": {
+ "version": "2.0.0-rc.4",
+ "from": "react-on-rails@2.0.0-rc.4"
+ },
"react-overlays": {
"version": "0.5.4",
"from": "react-overlays@>=0.5.2 <0.6.0",
diff --git a/client/package.json b/client/package.json
index 4a154c5c..1d086dad 100644
--- a/client/package.json
+++ b/client/package.json
@@ -69,6 +69,7 @@
"react-addons-pure-render-mixin": "^0.14.3",
"react-bootstrap": "^0.28.1",
"react-dom": "^0.14.3",
+ "react-on-rails": "^2.0.0-rc.4",
"react-redux": "^4.0.0",
"react-router": "^2.0.0-rc4",
"redux": "^3.0.4",
diff --git a/client/webpack.client.base.config.js b/client/webpack.client.base.config.js
index 5c0ad1e9..c7e4f05e 100644
--- a/client/webpack.client.base.config.js
+++ b/client/webpack.client.base.config.js
@@ -17,19 +17,19 @@ module.exports = {
vendor: [
'babel-polyfill',
'jquery',
- 'react',
- 'react-dom',
],
// This will contain the app entry points defined by webpack.hot.config and webpack.rails.config
app: [
- './app/bundles/comments/startup/clientGlobals',
+ './app/bundles/comments/startup/clientRegistration',
],
},
resolve: {
extensions: ['', '.js', '.jsx'],
alias: {
libs: path.join(process.cwd(), 'app', 'libs'),
+ react: path.resolve('./node_modules/react'),
+ 'react-dom': path.resolve('./node_modules/react-dom'),
},
},
plugins: [
@@ -59,10 +59,6 @@ module.exports = {
{ test: /\.(ttf|eot)$/, loader: 'file' },
{ test: /\.(jpe?g|png|gif|svg|ico)$/, loader: 'url?limit=10000' },
- // React is necessary for the client rendering
- { test: require.resolve('react'), loader: 'expose?React' },
- { test: require.resolve('react-dom'), loader: 'expose?ReactDOM' },
- { test: require.resolve('jquery-ujs'), loader: 'imports?jQuery=jquery' },
{ test: require.resolve('jquery'), loader: 'expose?jQuery' },
{ test: require.resolve('jquery'), loader: 'expose?$' },
diff --git a/client/webpack.client.rails.build.config.js b/client/webpack.client.rails.build.config.js
index d2d67890..db250632 100644
--- a/client/webpack.client.rails.build.config.js
+++ b/client/webpack.client.rails.build.config.js
@@ -27,7 +27,11 @@ config.entry.vendor.unshift(
// See webpack.common.config for adding modules common to both the webpack dev server and rails
config.module.loaders.push(
- { test: /\.jsx?$/, loader: 'babel-loader', exclude: /node_modules/ },
+ {
+ test: /\.jsx?$/,
+ loader: 'babel-loader',
+ exclude: /node_modules/,
+ },
{
test: /\.css$/,
loader: ExtractTextPlugin.extract(
@@ -49,6 +53,10 @@ config.module.loaders.push(
{
test: require.resolve('react'),
loader: 'imports?shim=es5-shim/es5-shim&sham=es5-shim/es5-sham',
+ },
+ {
+ test: require.resolve('jquery-ujs'),
+ loader: 'imports?jQuery=jquery',
}
);
diff --git a/client/webpack.client.rails.hot.config.js b/client/webpack.client.rails.hot.config.js
index 6144eff5..5bb9562a 100644
--- a/client/webpack.client.rails.hot.config.js
+++ b/client/webpack.client.rails.hot.config.js
@@ -67,6 +67,10 @@ config.module.loaders.push(
'sass',
'sass-resources',
],
+ },
+ {
+ test: require.resolve('jquery-ujs'),
+ loader: 'imports?jQuery=jquery',
}
);
diff --git a/client/webpack.server.rails.build.config.js b/client/webpack.server.rails.build.config.js
index 35364f76..2a70cdba 100644
--- a/client/webpack.server.rails.build.config.js
+++ b/client/webpack.server.rails.build.config.js
@@ -11,9 +11,8 @@ module.exports = {
// the project dir
context: __dirname,
entry: [
- 'react',
- 'react-dom/server',
- './app/bundles/comments/startup/serverGlobals',
+ 'babel-polyfill',
+ './app/bundles/comments/startup/serverRegistration',
],
output: {
filename: 'server-bundle.js',
@@ -49,10 +48,6 @@ module.exports = {
'sass-resources',
],
},
-
- // React is necessary for the client rendering:
- { test: require.resolve('react'), loader: 'expose?React' },
- { test: require.resolve('react-dom/server'), loader: 'expose?ReactDOMServer' },
],
},
diff --git a/config/initializers/react_on_rails.rb b/config/initializers/react_on_rails.rb
index 41d6c24e..7802e01a 100644
--- a/config/initializers/react_on_rails.rb
+++ b/config/initializers/react_on_rails.rb
@@ -8,7 +8,6 @@
# Below options can be overriden by passing to the helper method.
config.prerender = true # default is false
- config.generator_function = true # default is false, meaning that you expose ReactComponents directly
config.trace = Rails.env.development? # default is true for development, off otherwise
# For server rendering. This can be set to false so that server side messages are discarded.
diff --git a/docs/jbuilder.md b/docs/jbuilder.md
index f777f805..e1352884 100644
--- a/docs/jbuilder.md
+++ b/docs/jbuilder.md
@@ -3,7 +3,7 @@ There's a bunch of gotchas with using [Jbuilder](https://github.com/rails/jbuild
```erb
<%= react_component('App', render(template: "/comments/index.json.jbuilder"),
- generator_function: true, prerender: true) %>
+ prerender: true) %>
```
However, if you try to set the value of the JSON string inside of the controller, then you will run into several issues with rendering the Jbuilder template from the controller. See the notes in this the example code for app/controllers/pages_controller.rb.