react_on_rails 16.0.1.rc.2 → 16.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +4 -4
- data/AI_AGENT_INSTRUCTIONS.md +63 -0
- data/CHANGELOG.md +55 -29
- data/CLAUDE.md +4 -3
- data/CODING_AGENTS.md +1 -0
- data/Gemfile.development_dependencies +4 -0
- data/Gemfile.lock +7 -1
- data/NEWS.md +1 -1
- data/README.md +41 -28
- data/lib/generators/react_on_rails/base_generator.rb +59 -51
- data/lib/generators/react_on_rails/install_generator.rb +139 -1
- data/lib/generators/react_on_rails/react_with_redux_generator.rb +9 -10
- data/lib/generators/react_on_rails/templates/base/base/config/initializers/react_on_rails.rb.tt +11 -2
- data/lib/generators/react_on_rails/templates/base/base/config/webpack/serverWebpackConfig.js.tt +3 -2
- data/lib/react_on_rails/configuration.rb +63 -50
- data/lib/react_on_rails/json_parse_error.rb +6 -1
- data/lib/react_on_rails/packer_utils.rb +39 -52
- data/lib/react_on_rails/packs_generator.rb +3 -0
- data/lib/react_on_rails/prerender_error.rb +4 -0
- data/lib/react_on_rails/server_rendering_pool/ruby_embedded_java_script.rb +5 -3
- data/lib/react_on_rails/system_checker.rb +6 -6
- data/lib/react_on_rails/test_helper/webpack_assets_compiler.rb +1 -1
- data/lib/react_on_rails/test_helper/webpack_assets_status_checker.rb +1 -2
- data/lib/react_on_rails/test_helper.rb +2 -3
- data/lib/react_on_rails/utils.rb +84 -41
- data/lib/react_on_rails/version.rb +1 -1
- data/lib/tasks/generate_packs.rake +21 -7
- metadata +2 -2
- data/package-lock.json +0 -11984
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA256:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: e606cadbca5e1019c44272e88ae2a7ec148b9becf9817dc74925fc531bb2b80f
|
4
|
+
data.tar.gz: 88a6a32f2def3bdb2231a39e5900c1b0c5054e2f2d7c3126a53599b85e54a767
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: 4548a73877807049e0ce8ba5146468e473e6c0b17765e1866f001cd2dba6564d00e51b1a70a9ff8a421dc396f108908da68913a97f86167d6aac32e6ca792658
|
7
|
+
data.tar.gz: 8f4ab4ed17438e1d64ccd1c7b54417e6158ea39d3b1498f04b7778fe65eb735a8fdbe0cce112d11388ab14d26ff6e0cbdd846a7af79740333af35aecdf34a942
|
@@ -0,0 +1,63 @@
|
|
1
|
+
# 🤖 AI Agent Instructions: React on Rails Setup
|
2
|
+
|
3
|
+
_Super concise, copy-paste instructions for AI agents to set up React on Rails in common scenarios._
|
4
|
+
|
5
|
+
## 🔍 **Before Starting: Check Current Versions**
|
6
|
+
|
7
|
+
```bash
|
8
|
+
# Get latest available versions (recommended approach)
|
9
|
+
gem search react_on_rails --remote
|
10
|
+
```
|
11
|
+
|
12
|
+
Install and update gem and npm package using strict option.
|
13
|
+
|
14
|
+
---
|
15
|
+
|
16
|
+
## 🆕 Scenario 1: New Rails App with React on Rails
|
17
|
+
|
18
|
+
```bash
|
19
|
+
# Create new Rails app
|
20
|
+
rails new myapp --skip-javascript --database=postgresql
|
21
|
+
cd myapp
|
22
|
+
|
23
|
+
# Use latest version
|
24
|
+
bundle add react_on_rails --strict
|
25
|
+
|
26
|
+
bin/rails generate react_on_rails:install
|
27
|
+
|
28
|
+
# Accept change to bin/dev
|
29
|
+
|
30
|
+
# Start development servers
|
31
|
+
bin/dev
|
32
|
+
```
|
33
|
+
|
34
|
+
**✅ Success Check:** Visit `http://localhost:3000/hello_world` → Should see "Hello World" from React
|
35
|
+
|
36
|
+
---
|
37
|
+
|
38
|
+
## 🔄 Scenario 2: Add React on Rails to Existing Rails App
|
39
|
+
|
40
|
+
```bash
|
41
|
+
cd /path/to/existing/app
|
42
|
+
# Use latest version
|
43
|
+
bundle add react_on_rails --strict
|
44
|
+
|
45
|
+
bin/rails generate react_on_rails:install
|
46
|
+
|
47
|
+
# Accept change to bin/dev
|
48
|
+
|
49
|
+
# Start development servers
|
50
|
+
bin/dev
|
51
|
+
# Navigate to existing Rails app root
|
52
|
+
|
53
|
+
# Start development
|
54
|
+
bin/dev
|
55
|
+
```
|
56
|
+
|
57
|
+
---
|
58
|
+
|
59
|
+
## 🛠️ Common Troubleshooting Commands
|
60
|
+
|
61
|
+
- Always run `bin/dev` to test setup, and check browser console for any JavaScript errors
|
62
|
+
- `bin/dev kill` stops other conflicting processes
|
63
|
+
- `bin/rake react_on_rails:doctor` for helpful information
|
data/CHANGELOG.md
CHANGED
@@ -23,50 +23,74 @@ After a release, please make sure to run `bundle exec rake update_changelog`. Th
|
|
23
23
|
|
24
24
|
Changes since the last non-beta release.
|
25
25
|
|
26
|
-
|
26
|
+
### [16.1.0] - 2025-09-23
|
27
27
|
|
28
|
-
|
28
|
+
#### New Features
|
29
29
|
|
30
|
-
|
30
|
+
- **Server Bundle Security**: Added new configuration options for enhanced server bundle security and organization:
|
31
31
|
|
32
|
-
|
32
|
+
- `server_bundle_output_path`: Configurable directory (relative to the Rails root) for server bundle output (default: "ssr-generated"). If set to `nil`, the server bundle will be loaded from the same public directory as client bundles. [PR 1798](https://github.com/shakacode/react_on_rails/pull/1798) by [justin808](https://github.com/justin808)
|
33
|
+
- `enforce_private_server_bundles`: When enabled, ensures server bundles are only loaded from private directories outside the public folder (default: false for backward compatibility) [PR 1798](https://github.com/shakacode/react_on_rails/pull/1798) by [justin808](https://github.com/justin808)
|
33
34
|
|
34
|
-
|
35
|
+
- **Improved Bundle Path Resolution**: Bundle path resolution for server bundles now works as follows:
|
35
36
|
|
36
|
-
-
|
37
|
-
-
|
38
|
-
-
|
39
|
-
-
|
37
|
+
- If `server_bundle_output_path` is set, the server bundle is loaded from that directory.
|
38
|
+
- If `server_bundle_output_path` is not set, the server bundle falls back to the client bundle directory (typically the public output path).
|
39
|
+
- If `enforce_private_server_bundles` is enabled:
|
40
|
+
- The server bundle will only be loaded from the private directory specified by `server_bundle_output_path`.
|
41
|
+
- If the bundle is not found there, it will _not_ fall back to the public directory.
|
42
|
+
- If `enforce_private_server_bundles` is not enabled and the bundle is not found in the private directory, it will fall back to the public directory.
|
43
|
+
- This logic ensures that, when strict enforcement is enabled, server bundles are never loaded from public directories, improving security and clarity of bundle resolution. [PR 1798](https://github.com/shakacode/react_on_rails/pull/1798) by [justin808](https://github.com/justin808)
|
40
44
|
|
41
|
-
|
45
|
+
- **`react_on_rails:doctor` rake task**: New diagnostic command to validate React on Rails setup and identify configuration issues. Provides comprehensive checks for environment prerequisites, dependencies, Rails integration, and Webpack configuration. Use `rake react_on_rails:doctor` to diagnose your setup, with optional `VERBOSE=true` for detailed output. [PR 1791](https://github.com/shakacode/react_on_rails/pull/1791) by [AbanoubGhadban](https://github.com/AbanoubGhadban)
|
42
46
|
|
43
|
-
|
44
|
-
- **Security improvements**: Hardened DOM selectors using `CSS.escape()` and proper JavaScript escaping for XSS protection
|
45
|
-
- **Architecture refactoring**: Centralized Pro utilities and clean separation between core and Pro helper functionality
|
47
|
+
#### Deprecations
|
46
48
|
|
47
|
-
|
49
|
+
- **Deprecated `generated_assets_dirs` configuration**: The legacy `config.generated_assets_dirs` option is now deprecated and will show a deprecation warning if used. Since Shakapacker is now required, asset paths are automatically determined from `shakapacker.yml` configuration. Remove any `config.generated_assets_dirs` from your `config/initializers/react_on_rails.rb` file. Use `public_output_path` in `config/shakapacker.yml` to customize asset output location instead. [PR 1798](https://github.com/shakacode/react_on_rails/pull/1798) by [justin808](https://github.com/justin808)
|
48
50
|
|
49
|
-
|
51
|
+
#### API Improvements
|
50
52
|
|
51
|
-
- **
|
52
|
-
-
|
53
|
-
-
|
54
|
-
-
|
53
|
+
- **Method Naming Clarification**: Added `public_bundles_full_path` method to clarify bundle path handling:
|
54
|
+
- `public_bundles_full_path`: New method specifically for webpack bundles in public directories
|
55
|
+
- `generated_assets_full_path`: Now deprecated (backwards-compatible alias)
|
56
|
+
- This eliminates confusion between webpack bundles and general Rails public assets [PR 1798](https://github.com/shakacode/react_on_rails/pull/1798) by [justin808](https://github.com/justin808)
|
55
57
|
|
56
|
-
|
58
|
+
#### Security Enhancements
|
57
59
|
|
58
|
-
- **
|
59
|
-
- **
|
60
|
+
- **Private Server Bundle Enforcement**: When `enforce_private_server_bundles` is enabled, server bundles bypass public directory fallbacks and are only loaded from designated private locations [PR 1798](https://github.com/shakacode/react_on_rails/pull/1798) by [justin808](https://github.com/justin808)
|
61
|
+
- **Path Validation**: Added validation to ensure `server_bundle_output_path` points to private directories when enforcement is enabled [PR 1798](https://github.com/shakacode/react_on_rails/pull/1798) by [justin808](https://github.com/justin808)
|
62
|
+
- **Fixed command injection vulnerabilities**: Replaced unsafe string interpolation in generator package installation commands with secure array-based system calls [PR 1786](https://github.com/shakacode/react_on_rails/pull/1786) by [justin808](https://github.com/justin808)
|
63
|
+
- **Improved input validation**: Enhanced package manager validation and argument sanitization across all generators [PR 1786](https://github.com/shakacode/react_on_rails/pull/1786) by [justin808](https://github.com/justin808)
|
64
|
+
- **Hardened DOM selectors**: Using `CSS.escape()` and proper JavaScript escaping for XSS protection [PR 1791](https://github.com/shakacode/react_on_rails/pull/1791) by [AbanoubGhadban](https://github.com/AbanoubGhadban)
|
60
65
|
|
61
|
-
|
66
|
+
#### Pro License Features
|
62
67
|
|
63
|
-
- **
|
64
|
-
- **
|
65
|
-
- **
|
68
|
+
- **Core/Pro separation**: Moved Pro features into dedicated `lib/react_on_rails/pro/` and `node_package/src/pro/` directories with clear licensing boundaries [PR 1791](https://github.com/shakacode/react_on_rails/pull/1791) by [AbanoubGhadban](https://github.com/AbanoubGhadban)
|
69
|
+
- **Runtime license validation**: Implemented Pro license gating with graceful fallback to core functionality when Pro license unavailable [PR 1791](https://github.com/shakacode/react_on_rails/pull/1791) by [AbanoubGhadban](https://github.com/AbanoubGhadban)
|
70
|
+
- **Enhanced immediate hydration**: Improved immediate hydration functionality with Pro license validation and warning badges [PR 1791](https://github.com/shakacode/react_on_rails/pull/1791) by [AbanoubGhadban](https://github.com/AbanoubGhadban)
|
71
|
+
- **License documentation**: Added NOTICE files in Pro directories referencing canonical `REACT-ON-RAILS-PRO-LICENSE.md` [PR 1791](https://github.com/shakacode/react_on_rails/pull/1791) by [AbanoubGhadban](https://github.com/AbanoubGhadban)
|
66
72
|
|
67
|
-
####
|
73
|
+
#### Generator Improvements
|
74
|
+
|
75
|
+
- **Modern TypeScript patterns**: Generators now produce more idiomatic TypeScript code with improved type inference instead of explicit type annotations [PR 1786](https://github.com/shakacode/react_on_rails/pull/1786) by [justin808](https://github.com/justin808)
|
76
|
+
- **Optimized tsconfig.json**: Updated compiler options to use `"moduleResolution": "bundler"` for better bundler compatibility [PR 1786](https://github.com/shakacode/react_on_rails/pull/1786) by [justin808](https://github.com/justin808)
|
77
|
+
- **Enhanced Redux TypeScript integration**: Improved type safety and modern React patterns (useMemo, type-only imports) [PR 1786](https://github.com/shakacode/react_on_rails/pull/1786) by [justin808](https://github.com/justin808)
|
78
|
+
- **Smart bin/dev defaults**: Generated `bin/dev` script now automatically navigates to `/hello_world` route for immediate component visibility [PR 1786](https://github.com/shakacode/react_on_rails/pull/1786) by [justin808](https://github.com/justin808)
|
79
|
+
- **Better component templates**: Removed unnecessary type annotations while maintaining type safety through TypeScript's inference [PR 1786](https://github.com/shakacode/react_on_rails/pull/1786) by [justin808](https://github.com/justin808)
|
80
|
+
- **Cleaner generated code**: Streamlined templates following modern React and TypeScript best practices [PR 1786](https://github.com/shakacode/react_on_rails/pull/1786) by [justin808](https://github.com/justin808)
|
81
|
+
- **Improved helper methods**: Added reusable `component_extension` helper for consistent file extension handling [PR 1786](https://github.com/shakacode/react_on_rails/pull/1786) by [justin808](https://github.com/justin808)
|
82
|
+
|
83
|
+
#### Bug Fixes
|
84
|
+
|
85
|
+
- **Doctor rake task**: Fixed LoadError in `rake react_on_rails:doctor` when using packaged gem. The task was trying to require excluded `rakelib/task_helpers` file. [PR 1795](https://github.com/shakacode/react_on_rails/pull/1795) by [justin808](https://github.com/justin808)
|
86
|
+
- **Packs generator**: Fixed error when `server_bundle_js_file` configuration is empty (default). Added safety check to prevent attempting operations on invalid file paths when server-side rendering is not configured. [PR 1802](https://github.com/shakacode/react_on_rails/pull/1802) by [justin808](https://github.com/justin808)
|
87
|
+
- **Non-Packer Environment Compatibility**: Fixed potential NoMethodError when using bundle path resolution in environments without Shakapacker [PR 1798](https://github.com/shakacode/react_on_rails/pull/1798) by [justin808](https://github.com/justin808)
|
88
|
+
- **Shakapacker version requirements**: Fixed inconsistent version requirements between basic pack generation (6.5.1+) and advanced auto-bundling features (7.0.0+). Added backward compatibility for users on Shakapacker 6.5.1-6.9.x while providing clear upgrade guidance for advanced features. Added new constants `MINIMUM_SHAKAPACKER_VERSION_FOR_AUTO_BUNDLING` and improved version checking performance with caching. [PR 1798](https://github.com/shakacode/react_on_rails/pull/1798) by [justin808](https://github.com/justin808)
|
89
|
+
|
90
|
+
#### Code Improvements
|
68
91
|
|
69
|
-
-
|
92
|
+
- **PackerUtils abstraction removal**: Removed unnecessary `PackerUtils.packer` abstraction method and replaced all calls with direct `::Shakapacker` usage. This simplifies the codebase by eliminating an abstraction layer that was originally created to support multiple webpack tools but is no longer needed since we only support Shakapacker. All tests updated accordingly. [PR 1798](https://github.com/shakacode/react_on_rails/pull/1798) by [claude-code](https://claude.ai/code)
|
93
|
+
- **Architecture refactoring**: Centralized Pro utilities and clean separation between core and Pro helper functionality [PR 1791](https://github.com/shakacode/react_on_rails/pull/1791) by [AbanoubGhadban](https://github.com/AbanoubGhadban)
|
70
94
|
|
71
95
|
### [16.0.0] - 2025-09-16
|
72
96
|
|
@@ -1652,7 +1676,9 @@ such as:
|
|
1652
1676
|
|
1653
1677
|
- Fix several generator-related issues.
|
1654
1678
|
|
1655
|
-
[Unreleased]: https://github.com/shakacode/react_on_rails/compare/16.0.1-rc.
|
1679
|
+
[Unreleased]: https://github.com/shakacode/react_on_rails/compare/16.0.1-rc.4...master
|
1680
|
+
[16.0.1-rc.4]: https://github.com/shakacode/react_on_rails/compare/16.0.1-rc.2...16.0.1-rc.4
|
1681
|
+
[16.0.1-rc.2]: https://github.com/shakacode/react_on_rails/compare/16.0.1-rc.0...16.0.1-rc.2
|
1656
1682
|
[16.0.1-rc.0]: https://github.com/shakacode/react_on_rails/compare/16.0.0...16.0.1-rc.0
|
1657
1683
|
[16.0.0]: https://github.com/shakacode/react_on_rails/compare/14.2.0...16.0.0
|
1658
1684
|
[14.2.0]: https://github.com/shakacode/react_on_rails/compare/14.1.1...14.2.0
|
data/CLAUDE.md
CHANGED
@@ -9,7 +9,7 @@ This file provides guidance to Claude Code (claude.ai/code) when working with co
|
|
9
9
|
1. **ALWAYS run `bundle exec rubocop` and fix ALL violations**
|
10
10
|
2. **ALWAYS ensure files end with a newline character**
|
11
11
|
3. **NEVER push without running full lint check first**
|
12
|
-
4. **ALWAYS let Prettier handle ALL formatting - never manually format**
|
12
|
+
4. **ALWAYS let Prettier and RuboCop handle ALL formatting - never manually format**
|
13
13
|
|
14
14
|
These requirements are non-negotiable. CI will fail if not followed.
|
15
15
|
|
@@ -39,10 +39,11 @@ Git hooks will automatically run linting on **all changed files (staged + unstag
|
|
39
39
|
- **Build**: `yarn run build` (compiles TypeScript to JavaScript in node_package/lib)
|
40
40
|
- **Type checking**: `yarn run type-check`
|
41
41
|
- **⚠️ MANDATORY BEFORE GIT PUSH**: `bundle exec rubocop` and fix ALL violations + ensure trailing newlines
|
42
|
+
- Never run `npm` commands, only equivalent Yarn Classic ones
|
42
43
|
|
43
44
|
## ⚠️ FORMATTING RULES
|
44
45
|
|
45
|
-
**Prettier is the SOLE authority for formatting. NEVER manually format code.**
|
46
|
+
**Prettier is the SOLE authority for formatting non-Ruby files, and RuboCop for formatting Ruby files. NEVER manually format code.**
|
46
47
|
|
47
48
|
### Standard Workflow
|
48
49
|
1. Make code changes
|
@@ -120,10 +121,10 @@ This project maintains both a Ruby gem and an NPM package:
|
|
120
121
|
## Important Notes
|
121
122
|
|
122
123
|
- Use `yalc` for local development when testing with external apps
|
123
|
-
- The project supports both Webpacker and Shakapacker
|
124
124
|
- Server-side rendering uses isolated Node.js processes
|
125
125
|
- React Server Components support available in Pro version
|
126
126
|
- Generated examples are in `gen-examples/` (ignored by git)
|
127
|
+
- Only use `yarn` as the JS package manager, never `npm`
|
127
128
|
|
128
129
|
## IDE Configuration
|
129
130
|
|
data/CODING_AGENTS.md
CHANGED
@@ -30,6 +30,7 @@ cd spec/dummy && foreman start # Start dummy app with webpack
|
|
30
30
|
- [ ] No trailing whitespace
|
31
31
|
- [ ] Line length ≤120 characters
|
32
32
|
- [ ] Security violations properly scoped with disable comments
|
33
|
+
- [ ] No `package-lock.json` or other non-Yarn lock files (except `Gemfile.lock`)
|
33
34
|
|
34
35
|
## Development Patterns for AI Contributors
|
35
36
|
|
@@ -39,6 +39,10 @@ group :development, :test do
|
|
39
39
|
gem "scss_lint", require: false
|
40
40
|
gem "spring", "~> 4.0"
|
41
41
|
gem "lefthook", require: false
|
42
|
+
# Added for Ruby 3.5+ compatibility to silence warnings
|
43
|
+
gem "benchmark", require: false
|
44
|
+
gem "logger", require: false
|
45
|
+
gem "ostruct", require: false
|
42
46
|
end
|
43
47
|
|
44
48
|
group :test do
|
data/Gemfile.lock
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
PATH
|
2
2
|
remote: .
|
3
3
|
specs:
|
4
|
-
react_on_rails (16.
|
4
|
+
react_on_rails (16.1.0)
|
5
5
|
addressable
|
6
6
|
connection_pool
|
7
7
|
execjs (~> 2.5)
|
@@ -91,6 +91,7 @@ GEM
|
|
91
91
|
amazing_print (1.6.0)
|
92
92
|
ast (2.4.2)
|
93
93
|
base64 (0.2.0)
|
94
|
+
benchmark (0.4.1)
|
94
95
|
bigdecimal (3.1.8)
|
95
96
|
bootsnap (1.18.3)
|
96
97
|
msgpack (~> 1.2)
|
@@ -160,6 +161,7 @@ GEM
|
|
160
161
|
listen (3.9.0)
|
161
162
|
rb-fsevent (~> 0.10, >= 0.10.3)
|
162
163
|
rb-inotify (~> 0.9, >= 0.9.10)
|
164
|
+
logger (1.7.0)
|
163
165
|
loofah (2.22.0)
|
164
166
|
crass (~> 1.0.2)
|
165
167
|
nokogiri (>= 1.12.0)
|
@@ -189,6 +191,7 @@ GEM
|
|
189
191
|
nokogiri (1.16.6)
|
190
192
|
mini_portile2 (~> 2.8.2)
|
191
193
|
racc (~> 1.4)
|
194
|
+
ostruct (0.6.1)
|
192
195
|
package_json (0.1.0)
|
193
196
|
parallel (1.24.0)
|
194
197
|
parser (3.3.1.0)
|
@@ -402,6 +405,7 @@ PLATFORMS
|
|
402
405
|
|
403
406
|
DEPENDENCIES
|
404
407
|
amazing_print
|
408
|
+
benchmark
|
405
409
|
bootsnap
|
406
410
|
capybara
|
407
411
|
capybara-screenshot
|
@@ -415,6 +419,8 @@ DEPENDENCIES
|
|
415
419
|
launchy
|
416
420
|
lefthook
|
417
421
|
listen
|
422
|
+
logger
|
423
|
+
ostruct
|
418
424
|
package_json
|
419
425
|
pry
|
420
426
|
pry-byebug
|
data/NEWS.md
CHANGED
@@ -21,7 +21,7 @@ _A history of the news. A few bullets at the top will also show on the [README.m
|
|
21
21
|
- 2017-04-09: 8.0.0 beta work to include webpacker_lite gem has begun. See [#786](https://github.com/shakacode/react_on_rails/issues/786).
|
22
22
|
- 2017-04-03: 6.9.3 Released! Props rendered in JSON script tag. Page size is smaller now due to less escaping!
|
23
23
|
- 2017-03-06: Updated to Webpack v2!
|
24
|
-
- 2017-03-02: Demo of internationalization (i18n) is live at [reactrails.com](https://
|
24
|
+
- 2017-03-02: Demo of internationalization (i18n) is live at [reactrails.com](https://reactrails.com/). Docs [here](docs/guides/i18n.md).
|
25
25
|
- 2017-02-28: See [discussions here on Webpacker](https://github.com/rails/webpacker/issues/139) regarding how Webpacker will allow React on Rails to avoid using the asset pipeline in the near future.
|
26
26
|
- 2017-02-28: Upgrade to Webpack v2 or use the `--bail` option in your Webpack script for test and production builds. See the discussion on [PR #730](https://github.com/shakacode/react_on_rails/pull/730).
|
27
27
|
- 2016-11-03: Spoke at [LA Ruby: "React on Rails: Why, What, and How?"](http://www.meetup.com/laruby/events/234825187/). [Video and pictures in this article](https://blog.shakacode.com/my-react-on-rails-talk-at-the-la-ruby-rails-meetup-november-10-2016-eaaa83aff800#.ej6h4eglp).
|
data/README.md
CHANGED
@@ -16,7 +16,7 @@
|
|
16
16
|
[](https://github.com/shakacode/react_on_rails/actions/workflows/rspec-package-specs.yml)
|
17
17
|
[](https://github.com/shakacode/react_on_rails/actions/workflows/lint-js-and-ruby.yml)
|
18
18
|
|
19
|
-
#
|
19
|
+
# ⚡ What's New
|
20
20
|
|
21
21
|
**🚀 React on Rails v16.0 Released!** Major modernization with ESM support, enhanced React Server Components, and streamlined configuration.
|
22
22
|
|
@@ -31,11 +31,13 @@
|
|
31
31
|
|
32
32
|
_These are the docs for React on Rails 16. To see the older docs and code: [v14](https://github.com/shakacode/react_on_rails/tree/14.0.0), [v13](https://github.com/shakacode/react_on_rails/tree/13.4.0), [v12](https://github.com/shakacode/react_on_rails/tree/12.6.0), and [v11](https://github.com/shakacode/react_on_rails/tree/11.3.0)._
|
33
33
|
|
34
|
-
# About
|
34
|
+
# 🎯 About React on Rails
|
35
35
|
|
36
|
-
React
|
36
|
+
**Seamlessly integrate React components into your Rails application** with server-side rendering, hot reloading, and automatic bundle optimization.
|
37
37
|
|
38
|
-
|
38
|
+
> **"The easiest way to add React to Rails"** - Thousands of developers rely on React on Rails for production applications.
|
39
|
+
|
40
|
+
This project is maintained by [ShakaCode](https://www.shakacode.com) with ❤️ from the Rails and React communities.
|
39
41
|
|
40
42
|
## ShakaCode Upgrade Support
|
41
43
|
|
@@ -93,30 +95,34 @@ We did this for Popmenu, [lowering Heroku costs 20-25% while getting a 73% decre
|
|
93
95
|
|
94
96
|
If you're interested, read more about [React on Rails Pro](https://www.shakacode.com/react-on-rails-pro/) and [book a call](https://meetings.hubspot.com/justingordon/30-minute-consultation).
|
95
97
|
|
96
|
-
#
|
98
|
+
# 📚 Quick Start
|
99
|
+
|
100
|
+
**New to React on Rails?** Get up and running in minutes:
|
97
101
|
|
98
|
-
|
102
|
+
🚀 **[15-Minute Quick Start](https://www.shakacode.com/react-on-rails/docs/quick-start/)** - Your first React component
|
103
|
+
📖 **[Complete Documentation](https://www.shakacode.com/react-on-rails/docs/)** - Comprehensive guides and API reference
|
104
|
+
🎮 **[Live Demo](https://reactrails.com)** - See it in action with [source code](https://github.com/shakacode/react-webpack-rails-tutorial)
|
99
105
|
|
100
106
|
## Project Objective
|
101
107
|
|
102
108
|
To provide a high-performance framework for integrating Ruby on Rails with React, especially regarding React Server-Side Rendering for better SEO and improved performance.
|
103
109
|
|
104
|
-
##
|
110
|
+
## ✨ Why React on Rails?
|
105
111
|
|
106
|
-
|
112
|
+
| Feature | Benefit |
|
113
|
+
| ----------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
|
114
|
+
| 🎯 **Smart Bundle Loading** | [Automated bundle optimization](./docs/guides/auto-bundling-file-system-based-automated-bundle-generation.md) based on components used - no more manual `javascript_pack_tags` configuration |
|
115
|
+
| ⚡ **Server-Side Rendering** | Enhanced React Server Components support for better SEO and UX performance |
|
116
|
+
| 🚀 **Advanced Loading** | `sync`, `async`, and `defer` options for optimal performance based on your needs |
|
117
|
+
| 🔥 **Hot Module Replacement** | Instant feedback during development with tight [Shakapacker](https://github.com/shakacode/shakapacker) integration |
|
118
|
+
| 📦 **Easy Props Passing** | Direct Rails → React data flow without separate API calls |
|
119
|
+
| 🗺️ **Router Integration** | [React Router](https://reactrouter.com/) with SSR support |
|
120
|
+
| 🏪 **State Management** | [Redux](https://redux.js.org/) integration with server-side rendering |
|
121
|
+
| 🌍 **Internationalization** | [I18n and localization support](https://www.shakacode.com/react-on-rails/docs/guides/i18n) for global apps |
|
122
|
+
| 🎨 **Modern React** | React 18+ with enhanced React Server Components and latest patterns |
|
123
|
+
| 🦄 **ReScript Support** | [ReScript integration](https://github.com/shakacode/rescript-react-on-rails-example) for type-safe development |
|
107
124
|
|
108
|
-
|
109
|
-
1. **Advanced loading strategies** with `sync`, `async`, and `defer` options for optimal performance based on your needs.
|
110
|
-
1. **Automatic configuration** of what bundles are added to the page based on what React components are on the page. This results in faster browser loading time via smaller bundle sizes.
|
111
|
-
1. **Keep up with the latest changes** in different versions of React. React 18+ is fully supported with enhanced React Server Components.
|
112
|
-
1. **Easy prop passing** directly from your Rails view to your React components rather than having your Rails view load and then make a separate request to your API.
|
113
|
-
Tight integration with [shakapacker](https://github.com/shakacode/shakapacker).
|
114
|
-
1. **Server-Side Rendering (SSR)** with enhanced React Server Components support, often used for SEO crawler indexing and UX performance.
|
115
|
-
1. **[Automated optimized entry-point creation and bundle inclusion](https://www.shakacode.com/react-on-rails/docs/guides/file-system-based-automated-bundle-generation/)** when placing a component on a page. With this feature, you no longer need to configure `javascript_pack_tags` and `stylesheet_pack_tags` on your layouts based on what's shown. "It just works!"
|
116
|
-
1. **[Redux](https://redux.js.org/) and [React Router](https://reactrouter.com/) integration** with server-side-rendering.
|
117
|
-
1. **[Internationalization (I18n) and (localization)](https://www.shakacode.com/react-on-rails/docs/guides/i18n)** support.
|
118
|
-
1. **Supportive community**. This [web search shows how live public sites are using React on Rails](https://publicwww.com/websites/%22react-on-rails%22++-undeveloped.com+depth%3Aall/).
|
119
|
-
1. **[ReScript Support](https://github.com/shakacode/rescript-react-on-rails-example)**.
|
125
|
+
> **Trusted by thousands** - See [real production sites](https://publicwww.com/websites/%22react-on-rails%22++-undeveloped.com+depth%3Aall/) using React on Rails
|
120
126
|
|
121
127
|
See [Rails/Shakapacker React Integration Options](https://www.shakacode.com/react-on-rails/docs/guides/rails-webpacker-react-integration-options) for comparisons to other gems.
|
122
128
|
|
@@ -140,16 +146,21 @@ _Requires creating a free account._
|
|
140
146
|
- Node.js >= 20 (CI tested: 20 - 22)
|
141
147
|
- A JavaScript package manager (npm, yarn, pnpm, or bun)
|
142
148
|
|
143
|
-
# Support
|
149
|
+
# 🆘 Get Help & Support
|
150
|
+
|
151
|
+
**Need immediate help?** Here are your options, ordered by response time:
|
144
152
|
|
145
|
-
-
|
153
|
+
- 🚀 **Professional Support**: [react_on_rails@shakacode.com](mailto:react_on_rails@shakacode.com) - Fastest resolution for bugs, upgrades, and consulting
|
154
|
+
- 💬 **React + Rails Slack**: [Join our community](https://invite.reactrails.com) - Chat with other developers
|
155
|
+
- 🆓 **GitHub Issues**: [Report bugs](https://github.com/shakacode/react_on_rails/issues) - Community support
|
156
|
+
- 📖 **Discussions**: [Ask questions](https://github.com/shakacode/react_on_rails/discussions) - General help
|
146
157
|
|
147
|
-
|
148
|
-
|
149
|
-
- **
|
150
|
-
- **[
|
151
|
-
-
|
152
|
-
-
|
158
|
+
**Additional Resources:**
|
159
|
+
|
160
|
+
- [**Subscribe**](https://app.mailerlite.com/webforms/landing/l1d9x5) for announcements of new releases and tutorials
|
161
|
+
- **[forum.shakacode.com](https://forum.shakacode.com)** - Development discussions
|
162
|
+
- **[@railsonmaui on Twitter](https://twitter.com/railsonmaui)** - Updates and tips
|
163
|
+
- [Projects using React on Rails](https://github.com/shakacode/react_on_rails/tree/master/PROJECTS.md) - Submit yours!
|
153
164
|
|
154
165
|
## Contributing
|
155
166
|
|
@@ -163,6 +174,8 @@ ShakaCode is **[hiring passionate software engineers](http://www.shakacode.com/c
|
|
163
174
|
|
164
175
|
The gem is available as open source under the terms of the [MIT License](https://github.com/shakacode/react_on_rails/tree/master/LICENSE.md).
|
165
176
|
|
177
|
+
Note, some features are available only with a React on Rails Pro subscription. See [React on Rails Pro](https://www.shakacode.com/react-on-rails-pro/) for more information.
|
178
|
+
|
166
179
|
# Supporters
|
167
180
|
|
168
181
|
The following companies support our open-source projects, and ShakaCode uses their products!
|
@@ -24,7 +24,7 @@ module ReactOnRails
|
|
24
24
|
end
|
25
25
|
|
26
26
|
def create_react_directories
|
27
|
-
# Create auto-
|
27
|
+
# Create auto-bundling directory structure for non-Redux components only
|
28
28
|
# Redux components handle their own directory structure
|
29
29
|
return if options.redux?
|
30
30
|
|
@@ -41,7 +41,7 @@ module ReactOnRails
|
|
41
41
|
base_templates = %w[config/initializers/react_on_rails.rb]
|
42
42
|
base_files.each { |file| copy_file("#{base_path}#{file}", file) }
|
43
43
|
base_templates.each do |file|
|
44
|
-
template("#{base_path}/#{file}.tt", file
|
44
|
+
template("#{base_path}/#{file}.tt", file)
|
45
45
|
end
|
46
46
|
end
|
47
47
|
|
@@ -95,55 +95,22 @@ module ReactOnRails
|
|
95
95
|
run "bundle"
|
96
96
|
end
|
97
97
|
|
98
|
-
def add_js_dependencies
|
99
|
-
add_react_on_rails_package
|
100
|
-
add_react_dependencies
|
101
|
-
add_css_dependencies
|
102
|
-
add_dev_dependencies
|
103
|
-
end
|
104
|
-
|
105
|
-
def install_js_dependencies
|
106
|
-
# Detect which package manager to use
|
107
|
-
success = if File.exist?(File.join(destination_root, "yarn.lock"))
|
108
|
-
system("yarn", "install")
|
109
|
-
elsif File.exist?(File.join(destination_root, "pnpm-lock.yaml"))
|
110
|
-
system("pnpm", "install")
|
111
|
-
elsif File.exist?(File.join(destination_root, "package-lock.json")) ||
|
112
|
-
File.exist?(File.join(destination_root, "package.json"))
|
113
|
-
# Use npm for package-lock.json or as default fallback
|
114
|
-
system("npm", "install")
|
115
|
-
else
|
116
|
-
true # No package manager detected, skip
|
117
|
-
end
|
118
|
-
|
119
|
-
unless success
|
120
|
-
GeneratorMessages.add_warning(<<~MSG.strip)
|
121
|
-
⚠️ JavaScript dependencies installation failed.
|
122
|
-
|
123
|
-
This could be due to network issues or missing package manager.
|
124
|
-
You can install dependencies manually later by running:
|
125
|
-
• npm install (if using npm)
|
126
|
-
• yarn install (if using yarn)
|
127
|
-
• pnpm install (if using pnpm)
|
128
|
-
MSG
|
129
|
-
end
|
130
|
-
|
131
|
-
success
|
132
|
-
end
|
133
|
-
|
134
98
|
def update_gitignore_for_auto_registration
|
135
99
|
gitignore_path = File.join(destination_root, ".gitignore")
|
136
100
|
return unless File.exist?(gitignore_path)
|
137
101
|
|
138
102
|
gitignore_content = File.read(gitignore_path)
|
139
|
-
return if gitignore_content.include?("**/generated/**")
|
140
103
|
|
141
|
-
|
142
|
-
|
104
|
+
additions = []
|
105
|
+
additions << "**/generated/**" unless gitignore_content.include?("**/generated/**")
|
106
|
+
additions << "ssr-generated" unless gitignore_content.include?("ssr-generated")
|
107
|
+
|
108
|
+
return if additions.empty?
|
143
109
|
|
144
|
-
|
145
|
-
|
146
|
-
|
110
|
+
append_to_file ".gitignore" do
|
111
|
+
lines = ["\n# Generated React on Rails packs"]
|
112
|
+
lines.concat(additions)
|
113
|
+
"#{lines.join("\n")}\n"
|
147
114
|
end
|
148
115
|
end
|
149
116
|
|
@@ -157,6 +124,28 @@ module ReactOnRails
|
|
157
124
|
end
|
158
125
|
end
|
159
126
|
|
127
|
+
CONFIGURE_RSPEC_TO_COMPILE_ASSETS = <<-STR.strip_heredoc
|
128
|
+
RSpec.configure do |config|
|
129
|
+
# Ensure that if we are running js tests, we are using latest webpack assets
|
130
|
+
# This will use the defaults of :js and :server_rendering meta tags
|
131
|
+
ReactOnRails::TestHelper.configure_rspec_to_compile_assets(config)
|
132
|
+
end
|
133
|
+
STR
|
134
|
+
|
135
|
+
private
|
136
|
+
|
137
|
+
def setup_js_dependencies
|
138
|
+
add_js_dependencies
|
139
|
+
install_js_dependencies
|
140
|
+
end
|
141
|
+
|
142
|
+
def add_js_dependencies
|
143
|
+
add_react_on_rails_package
|
144
|
+
add_react_dependencies
|
145
|
+
add_css_dependencies
|
146
|
+
add_dev_dependencies
|
147
|
+
end
|
148
|
+
|
160
149
|
def add_react_on_rails_package
|
161
150
|
major_minor_patch_only = /\A\d+\.\d+\.\d+\z/
|
162
151
|
|
@@ -219,15 +208,34 @@ module ReactOnRails
|
|
219
208
|
handle_npm_failure("development dependencies", dev_deps, dev: true) unless success
|
220
209
|
end
|
221
210
|
|
222
|
-
|
223
|
-
|
224
|
-
|
225
|
-
|
226
|
-
|
211
|
+
def install_js_dependencies
|
212
|
+
# Detect which package manager to use
|
213
|
+
success = if File.exist?(File.join(destination_root, "yarn.lock"))
|
214
|
+
system("yarn", "install")
|
215
|
+
elsif File.exist?(File.join(destination_root, "pnpm-lock.yaml"))
|
216
|
+
system("pnpm", "install")
|
217
|
+
elsif File.exist?(File.join(destination_root, "package-lock.json")) ||
|
218
|
+
File.exist?(File.join(destination_root, "package.json"))
|
219
|
+
# Use npm for package-lock.json or as default fallback
|
220
|
+
system("npm", "install")
|
221
|
+
else
|
222
|
+
true # No package manager detected, skip
|
223
|
+
end
|
224
|
+
|
225
|
+
unless success
|
226
|
+
GeneratorMessages.add_warning(<<~MSG.strip)
|
227
|
+
⚠️ JavaScript dependencies installation failed.
|
228
|
+
|
229
|
+
This could be due to network issues or missing package manager.
|
230
|
+
You can install dependencies manually later by running:
|
231
|
+
• npm install (if using npm)
|
232
|
+
• yarn install (if using yarn)
|
233
|
+
• pnpm install (if using pnpm)
|
234
|
+
MSG
|
227
235
|
end
|
228
|
-
STR
|
229
236
|
|
230
|
-
|
237
|
+
success
|
238
|
+
end
|
231
239
|
|
232
240
|
def handle_npm_failure(dependency_type, packages, dev: false)
|
233
241
|
install_command = dev ? "npm install --save-dev" : "npm install"
|