react_on_rails 16.0.0 → 16.0.1.rc.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/CHANGELOG.md +117 -77
- data/CLAUDE.md +14 -2
- data/Gemfile.lock +1 -1
- data/LICENSE.md +15 -1
- data/README.md +68 -18
- data/eslint.config.ts +3 -0
- data/knip.ts +20 -9
- data/lib/generators/react_on_rails/USAGE +65 -0
- data/lib/generators/react_on_rails/base_generator.rb +7 -7
- data/lib/generators/react_on_rails/generator_helper.rb +4 -0
- data/lib/generators/react_on_rails/generator_messages.rb +2 -2
- data/lib/generators/react_on_rails/install_generator.rb +115 -7
- data/lib/generators/react_on_rails/react_no_redux_generator.rb +16 -4
- data/lib/generators/react_on_rails/react_with_redux_generator.rb +83 -14
- data/lib/generators/react_on_rails/templates/base/base/app/javascript/src/HelloWorld/ror_components/HelloWorld.client.tsx +25 -0
- data/lib/generators/react_on_rails/templates/base/base/app/javascript/src/HelloWorld/ror_components/HelloWorld.server.tsx +5 -0
- data/lib/generators/react_on_rails/templates/base/base/bin/dev +12 -24
- data/lib/generators/react_on_rails/templates/redux/base/app/javascript/bundles/HelloWorld/actions/helloWorldActionCreators.ts +18 -0
- data/lib/generators/react_on_rails/templates/redux/base/app/javascript/bundles/HelloWorld/components/HelloWorld.tsx +24 -0
- data/lib/generators/react_on_rails/templates/redux/base/app/javascript/bundles/HelloWorld/constants/helloWorldConstants.ts +6 -0
- data/lib/generators/react_on_rails/templates/redux/base/app/javascript/bundles/HelloWorld/containers/HelloWorldContainer.ts +20 -0
- data/lib/generators/react_on_rails/templates/redux/base/app/javascript/bundles/HelloWorld/reducers/helloWorldReducer.ts +22 -0
- data/lib/generators/react_on_rails/templates/redux/base/app/javascript/bundles/HelloWorld/startup/HelloWorldApp.client.tsx +23 -0
- data/lib/generators/react_on_rails/templates/redux/base/app/javascript/bundles/HelloWorld/startup/HelloWorldApp.server.tsx +5 -0
- data/lib/generators/react_on_rails/templates/redux/base/app/javascript/bundles/HelloWorld/store/helloWorldStore.ts +18 -0
- data/lib/react_on_rails/configuration.rb +10 -6
- data/lib/react_on_rails/dev/server_manager.rb +185 -28
- data/lib/react_on_rails/doctor.rb +1149 -0
- data/lib/react_on_rails/helper.rb +9 -78
- data/lib/react_on_rails/pro/NOTICE +21 -0
- data/lib/react_on_rails/pro/helper.rb +122 -0
- data/lib/react_on_rails/pro/utils.rb +53 -0
- data/lib/react_on_rails/react_component/render_options.rb +6 -2
- data/lib/react_on_rails/system_checker.rb +659 -0
- data/lib/react_on_rails/version.rb +1 -1
- data/lib/tasks/doctor.rake +51 -0
- data/lib/tasks/generate_packs.rake +127 -4
- data/package-lock.json +11984 -0
- metadata +21 -6
- data/lib/generators/react_on_rails/bin/dev +0 -46
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA256:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: 6df96f164d23050adbea7f31bb61ab36a092fbad393d2d1d0e8a307f5c6a41d0
|
|
4
|
+
data.tar.gz: e6e4b7e5c65175310edc4e1c7a01df8ffdfc8cdb9ca7fc1b5012988db174d360
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: bf0ae04e65fe1225e159154df70a1043a447e15c058fe62a743e99fd4e8ef489b61b64766da0516d93faec781ed4d968e5b3bce85228e560f5c2c3a3646518ee
|
|
7
|
+
data.tar.gz: e604837b4b5182504ca2c2c38acbcdb8cf2dbea6f8fd94310fcedc28e4e8f4fe072048fdce21bed26317b0147d5712fb4a530a4c1fb3ae9bf52f47c05fa63a00
|
data/CHANGELOG.md
CHANGED
|
@@ -23,86 +23,126 @@ 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
|
-
|
|
27
|
-
|
|
28
|
-
#### Removed (Breaking Changes)
|
|
29
|
-
|
|
30
|
-
- **Webpacker support completely removed**. Shakapacker >= 6.0 is now required.
|
|
31
|
-
- Migration:
|
|
32
|
-
- Remove any `webpacker` gem references from your Gemfile
|
|
33
|
-
- Ensure `shakapacker` gem version 6.0 or higher is installed (8.0+ recommended)
|
|
34
|
-
- Replace any `bin/webpacker` commands with `bin/shakapacker`
|
|
35
|
-
- Update any webpacker configuration files to shakapacker equivalents
|
|
36
|
-
- Removed files: `rakelib/webpacker_examples.rake`, `lib/generators/react_on_rails/adapt_for_older_shakapacker_generator.rb`
|
|
37
|
-
- All webpacker compatibility code and tests have been removed
|
|
38
|
-
- **CI/Development runtime requirements updated**:
|
|
39
|
-
- _Note, this is just what CI tests_. You can use older versions of Ruby and Node.js, but you may run into issues.\*
|
|
40
|
-
- Minimum Ruby version: 3.2 (was 3.0)
|
|
41
|
-
- Maximum Ruby version: 3.4 (was 3.3)
|
|
42
|
-
- Minimum Node.js version: 20 (was 16)
|
|
43
|
-
- Maximum Node.js version: 22 (was 20)
|
|
44
|
-
- Migration: Upgrade your Ruby and Node.js versions to supported ranges
|
|
45
|
-
- **Install generator now validates prerequisites**:
|
|
46
|
-
- Generator now requires at least one JavaScript package manager (npm, pnpm, yarn, or bun)
|
|
47
|
-
- Generator uses `Thor::Error` exceptions instead of `exit(1)` for better error handling
|
|
48
|
-
- Migration: Ensure you have a JavaScript package manager installed before running the generator
|
|
49
|
-
|
|
50
|
-
#### Enhanced
|
|
51
|
-
|
|
52
|
-
- Simplified CI matrix configuration with clear dependency level naming (`minimum`/`latest` instead of `oldest`/`newest`)
|
|
53
|
-
- Improved error messages in install generator with clearer troubleshooting steps
|
|
54
|
-
- Enhanced package manager detection with multi-strategy validation
|
|
55
|
-
|
|
56
|
-
### [15.0.0] - 2025-08-28
|
|
57
|
-
|
|
58
|
-
See [Release Notes](docs/release-notes/16.0.0.md) for full details.
|
|
59
|
-
|
|
60
|
-
### Removed (Breaking Changes)
|
|
61
|
-
|
|
62
|
-
- Deprecated `defer_generated_component_packs` configuration option. You should use `generated_component_packs_loading_strategy` instead.
|
|
63
|
-
- Migration:
|
|
64
|
-
- `defer_generated_component_packs: true` → `generated_component_packs_loading_strategy: :defer`
|
|
65
|
-
- `defer_generated_component_packs: false` → `generated_component_packs_loading_strategy: :sync`
|
|
66
|
-
- For best performance, use `generated_component_packs_loading_strategy: :async`
|
|
67
|
-
- [PR 1712](https://github.com/shakacode/react_on_rails/pull/1712) by [AbanoubGhadban](https://github.com/AbanoubGhadban).
|
|
68
|
-
- The package is ESM-only now. Migration:
|
|
69
|
-
- If using `require('react-on-rails')`, upgrade to Node v20.19.0+ or change to `import`.
|
|
70
|
-
- For TypeScript errors, upgrade to TypeScript 5.8+ and set `module` to `nodenext`.
|
|
71
|
-
- `ReactOnRails.reactOnRailsPageLoaded` is now an async function. Migration:
|
|
72
|
-
- Add `await` when calling this function: `await ReactOnRails.reactOnRailsPageLoaded()`.
|
|
73
|
-
- **RENAMED**: `force_load` configuration renamed to `immediate_hydration` for better API clarity.
|
|
74
|
-
- `immediate_hydration` now defaults to `false` and requires React on Rails Pro license.
|
|
75
|
-
- Migration:
|
|
76
|
-
- `config.force_load = true` → `config.immediate_hydration = true`
|
|
77
|
-
- `react_component(force_load: true)` → `react_component(immediate_hydration: true)`
|
|
78
|
-
- `redux_store(force_load: true)` → `redux_store(immediate_hydration: true)`
|
|
79
|
-
|
|
80
|
-
For detailed migration instructions, see the [16.0.0 Release Notes](docs/release-notes/16.0.0.md).
|
|
81
|
-
|
|
82
|
-
#### Fixed
|
|
83
|
-
|
|
84
|
-
- Enable support for ReactRefreshWebpackPlugin v0.6.0 by adding conditional logic regarding configuration. [PR 1748](https://github.com/shakacode/react_on_rails/pull/1748) by [judahmeek](https://github.com/judahmeek).
|
|
85
|
-
- Replace RenderOptions.renderRequestId and use local trackers instead. This change should only be relevant to ReactOnRails Pro users. [PR 1745](https://github.com/shakacode/react_on_rails/pull/1745) by [AbanoubGhadban](https://github.com/AbanoubGhadban).
|
|
86
|
-
- Fixed invalid warnings about non-exact versions when using a pre-release version of React on Rails, as well as missing warnings when using different pre-release versions of the gem and the Node package. [PR 1742](https://github.com/shakacode/react_on_rails/pull/1742) by [alexeyr-ci2](https://github.com/alexeyr-ci2).
|
|
26
|
+
#### Pro License Structure Implementation
|
|
87
27
|
|
|
88
|
-
|
|
28
|
+
**🔐 License Architecture**
|
|
29
|
+
|
|
30
|
+
- **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)
|
|
31
|
+
- **Runtime license validation**: Implemented Pro license gating with graceful fallback to core functionality when Pro license unavailable
|
|
32
|
+
- **License documentation**: Added NOTICE files in Pro directories referencing canonical `REACT-ON-RAILS-PRO-LICENSE.md`
|
|
33
|
+
- **Updated LICENSE.md**: Clearly distinguishes core MIT license from Pro-licensed directories
|
|
34
|
+
|
|
35
|
+
**⚡ Pro Feature Enhancements**
|
|
36
|
+
|
|
37
|
+
- **Immediate hydration**: Enhanced immediate hydration functionality with Pro license validation and warning badges
|
|
38
|
+
- **Security improvements**: Hardened DOM selectors using `CSS.escape()` and proper JavaScript escaping for XSS protection
|
|
39
|
+
- **Architecture refactoring**: Centralized Pro utilities and clean separation between core and Pro helper functionality
|
|
40
|
+
|
|
41
|
+
#### Enhanced TypeScript Generator Support
|
|
42
|
+
|
|
43
|
+
**🔧 Generator Improvements**
|
|
44
|
+
|
|
45
|
+
- **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)
|
|
46
|
+
- **Optimized tsconfig.json**: Updated compiler options to use `"moduleResolution": "bundler"` for better bundler compatibility
|
|
47
|
+
- **Enhanced Redux TypeScript integration**: Improved type safety and modern React patterns (useMemo, type-only imports)
|
|
48
|
+
- **Smart bin/dev defaults**: Generated `bin/dev` script now automatically navigates to `/hello_world` route for immediate component visibility
|
|
49
|
+
|
|
50
|
+
**🔐 Security Enhancements**
|
|
51
|
+
|
|
52
|
+
- **Fixed command injection vulnerabilities**: Replaced unsafe string interpolation in generator package installation commands with secure array-based system calls
|
|
53
|
+
- **Improved input validation**: Enhanced package manager validation and argument sanitization across all generators
|
|
89
54
|
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
-
|
|
93
|
-
-
|
|
94
|
-
-
|
|
95
|
-
- Generated client packs now import from `react-on-rails/client` instead of `react-on-rails`. [PR 1706](https://github.com/shakacode/react_on_rails/pull/1706) by [alexeyr-ci](https://github.com/alexeyr-ci).
|
|
96
|
-
- The "optimization opportunity" message when importing the server-side `react-on-rails` instead of `react-on-rails/client` in browsers is now a warning for two reasons:
|
|
97
|
-
- Make it more prominent
|
|
98
|
-
- Include a stack trace when clicked
|
|
55
|
+
**🎯 Developer Experience**
|
|
56
|
+
|
|
57
|
+
- **Better component templates**: Removed unnecessary type annotations while maintaining type safety through TypeScript's inference
|
|
58
|
+
- **Cleaner generated code**: Streamlined templates following modern React and TypeScript best practices
|
|
59
|
+
- **Improved helper methods**: Added reusable `component_extension` helper for consistent file extension handling
|
|
99
60
|
|
|
100
61
|
#### Added
|
|
101
62
|
|
|
102
|
-
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
63
|
+
- **`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.
|
|
64
|
+
|
|
65
|
+
### [16.0.0] - 2025-09-16
|
|
66
|
+
|
|
67
|
+
**React on Rails v16 is a major release that modernizes the library with ESM support, removes legacy Webpacker compatibility, and introduces significant performance improvements. This release builds on the foundation of v14 with enhanced RSC (React Server Components) support and streamlined configuration.**
|
|
68
|
+
|
|
69
|
+
See [Release Notes](docs/release-notes/16.0.0.md) for complete migration guide.
|
|
70
|
+
|
|
71
|
+
#### Major Enhancements
|
|
72
|
+
|
|
73
|
+
**🚀 React Server Components (RSC) -- Requires React on Rails Pro**
|
|
74
|
+
|
|
75
|
+
- **Enhanced RSC rendering flow**: Eliminated double rendering and reduced HTTP requests
|
|
76
|
+
- **`RSCRoute` component**: Seamless server-side rendering with automatic payload injection and hydration [PR 1696](https://github.com/shakacode/react_on_rails/pull/1696) by [AbanoubGhadban](https://github.com/AbanoubGhadban)
|
|
77
|
+
- **Optimized RSC payload injection**: Now injected after component HTML markup for better performance [PR 1738](https://github.com/shakacode/react_on_rails/pull/1738) by [AbanoubGhadban](https://github.com/AbanoubGhadban)
|
|
78
|
+
- **Communication protocol v2.0.0**: Supports uploading multiple bundles at once for improved efficiency
|
|
79
|
+
|
|
80
|
+
**⚡ Performance & Loading Strategy**
|
|
81
|
+
|
|
82
|
+
- **New `generated_component_packs_loading_strategy`**: Choose from `sync`, `async`, or `defer` strategies [PR 1712](https://github.com/shakacode/react_on_rails/pull/1712) by [AbanoubGhadban](https://github.com/AbanoubGhadban)
|
|
83
|
+
- **Async render function support**: Components can now return from async render functions [PR 1720](https://github.com/shakacode/react_on_rails/pull/1720) by [AbanoubGhadban](https://github.com/AbanoubGhadban)
|
|
84
|
+
- **Optimized client imports**: Generated packs now import from `react-on-rails/client` for better tree-shaking [PR 1706](https://github.com/shakacode/react_on_rails/pull/1706) by [alexeyr-ci](https://github.com/alexeyr-ci)
|
|
85
|
+
|
|
86
|
+
#### Developer Experience
|
|
87
|
+
|
|
88
|
+
- **Enhanced error messaging**: Clearer troubleshooting steps and prominent optimization warnings
|
|
89
|
+
- **Modern global access**: Using `globalThis` instead of window/global detection [PR 1727](https://github.com/shakacode/react_on_rails/pull/1727) by [alexeyr-ci2](https://github.com/alexeyr-ci2)
|
|
90
|
+
- **Simplified CI configuration**: Clear `minimum`/`latest` dependency naming instead of `oldest`/`newest`
|
|
91
|
+
- **ReactRefreshWebpackPlugin v0.6.0 support**: Added conditional logic for proper configuration [PR 1748](https://github.com/shakacode/react_on_rails/pull/1748) by [judahmeek](https://github.com/judahmeek)
|
|
92
|
+
- **Version validation improvements**: Fixed invalid warnings with pre-release versions [PR 1742](https://github.com/shakacode/react_on_rails/pull/1742) by [alexeyr-ci2](https://github.com/alexeyr-ci2)
|
|
93
|
+
|
|
94
|
+
#### Breaking Changes
|
|
95
|
+
|
|
96
|
+
**🔧 Webpacker Support Removed**
|
|
97
|
+
|
|
98
|
+
- **Complete removal of Webpacker support**. Shakapacker >= 6.0 is now required.
|
|
99
|
+
- Migration:
|
|
100
|
+
- Remove `webpacker` gem from your Gemfile
|
|
101
|
+
- Install `shakapacker` gem version 6.0+ (8.0+ recommended)
|
|
102
|
+
- Replace `bin/webpacker` commands with `bin/shakapacker`
|
|
103
|
+
- Update webpacker configuration files to shakapacker equivalents
|
|
104
|
+
- Removed files: `rakelib/webpacker_examples.rake`, `lib/generators/react_on_rails/adapt_for_older_shakapacker_generator.rb`
|
|
105
|
+
|
|
106
|
+
**📦 Package System Modernization**
|
|
107
|
+
|
|
108
|
+
- **ESM-only package**: CommonJS `require()` no longer supported
|
|
109
|
+
- Migration:
|
|
110
|
+
- Replace `require('react-on-rails')` with `import ReactOnRails from 'react-on-rails'`
|
|
111
|
+
- For Node.js < 20.19.0, upgrade or use dynamic imports
|
|
112
|
+
- For TypeScript errors, upgrade to TypeScript 5.8+ and set `module: "nodenext"`
|
|
113
|
+
|
|
114
|
+
**⚡ Configuration API Changes**
|
|
115
|
+
|
|
116
|
+
- **`defer_generated_component_packs` deprecated** → use `generated_component_packs_loading_strategy`
|
|
117
|
+
- Migration:
|
|
118
|
+
|
|
119
|
+
- `defer_generated_component_packs: true` → `generated_component_packs_loading_strategy: :defer`
|
|
120
|
+
- `defer_generated_component_packs: false` → `generated_component_packs_loading_strategy: :sync`
|
|
121
|
+
- Recommended: `generated_component_packs_loading_strategy: :async` for best performance
|
|
122
|
+
|
|
123
|
+
- **`force_load` renamed to `immediate_hydration`** for API clarity
|
|
124
|
+
- Migration:
|
|
125
|
+
- `config.force_load = true` → `config.immediate_hydration = true`
|
|
126
|
+
- `react_component(force_load: true)` → `react_component(immediate_hydration: true)`
|
|
127
|
+
- `redux_store(force_load: true)` → `redux_store(immediate_hydration: true)`
|
|
128
|
+
- Note: `immediate_hydration` requires React on Rails Pro license
|
|
129
|
+
|
|
130
|
+
**🔄 Async API Changes**
|
|
131
|
+
|
|
132
|
+
- **`ReactOnRails.reactOnRailsPageLoaded()` is now async**
|
|
133
|
+
- Migration: Add `await` when calling: `await ReactOnRails.reactOnRailsPageLoaded()`
|
|
134
|
+
|
|
135
|
+
**🏗️ Runtime Suggested Versions**
|
|
136
|
+
|
|
137
|
+
- Ruby: 3.2 - 3.4 (was 3.0 - 3.3)
|
|
138
|
+
- Node.js: 20 - 22 (was 16 - 20)
|
|
139
|
+
- Note: These are CI-tested versions; older versions may work but aren't guaranteed
|
|
140
|
+
|
|
141
|
+
**🎯 Generator Improvements**
|
|
142
|
+
|
|
143
|
+
- Install generator now validates JavaScript package manager presence
|
|
144
|
+
- Improved error handling with `Thor::Error` instead of `exit(1)`
|
|
145
|
+
- Enhanced error messages with clearer troubleshooting steps
|
|
106
146
|
|
|
107
147
|
### [15.0.0] - 2025-08-28 - RETRACTED
|
|
108
148
|
|
|
@@ -1606,8 +1646,8 @@ such as:
|
|
|
1606
1646
|
|
|
1607
1647
|
- Fix several generator-related issues.
|
|
1608
1648
|
|
|
1609
|
-
[Unreleased]: https://github.com/shakacode/react_on_rails/compare/
|
|
1610
|
-
[
|
|
1649
|
+
[Unreleased]: https://github.com/shakacode/react_on_rails/compare/16.0.0...master
|
|
1650
|
+
[16.0.0]: https://github.com/shakacode/react_on_rails/compare/14.2.0...16.0.0
|
|
1611
1651
|
[14.2.0]: https://github.com/shakacode/react_on_rails/compare/14.1.1...14.2.0
|
|
1612
1652
|
[14.1.1]: https://github.com/shakacode/react_on_rails/compare/14.1.0...14.1.1
|
|
1613
1653
|
[14.1.0]: https://github.com/shakacode/react_on_rails/compare/14.0.5...14.1.0
|
data/CLAUDE.md
CHANGED
|
@@ -2,6 +2,16 @@
|
|
|
2
2
|
|
|
3
3
|
This file provides guidance to Claude Code (claude.ai/code) when working with code in this repository.
|
|
4
4
|
|
|
5
|
+
## ⚠️ CRITICAL REQUIREMENTS
|
|
6
|
+
|
|
7
|
+
**BEFORE EVERY COMMIT/PUSH:**
|
|
8
|
+
|
|
9
|
+
1. **ALWAYS run `bundle exec rubocop` and fix ALL violations**
|
|
10
|
+
2. **ALWAYS ensure files end with a newline character**
|
|
11
|
+
3. **NEVER push without running full lint check first**
|
|
12
|
+
|
|
13
|
+
These requirements are non-negotiable. CI will fail if not followed.
|
|
14
|
+
|
|
5
15
|
## Development Commands
|
|
6
16
|
|
|
7
17
|
### Essential Commands
|
|
@@ -11,15 +21,17 @@ This file provides guidance to Claude Code (claude.ai/code) when working with co
|
|
|
11
21
|
- Ruby tests: `rake run_rspec`
|
|
12
22
|
- JavaScript tests: `yarn run test` or `rake js_tests`
|
|
13
23
|
- All tests: `rake` (default task runs lint and all tests except examples)
|
|
14
|
-
- **Linting
|
|
24
|
+
- **Linting** (MANDATORY BEFORE EVERY COMMIT):
|
|
25
|
+
- **REQUIRED**: `bundle exec rubocop` - Must pass with zero offenses
|
|
15
26
|
- All linters: `rake lint` (runs ESLint and RuboCop)
|
|
16
27
|
- ESLint only: `yarn run lint` or `rake lint:eslint`
|
|
17
28
|
- RuboCop only: `rake lint:rubocop`
|
|
18
29
|
- **Code Formatting**:
|
|
19
|
-
- Format code with Prettier: `
|
|
30
|
+
- Format code with Prettier: `rake autofix`
|
|
20
31
|
- Check formatting without fixing: `yarn start format.listDifferent`
|
|
21
32
|
- **Build**: `yarn run build` (compiles TypeScript to JavaScript in node_package/lib)
|
|
22
33
|
- **Type checking**: `yarn run type-check`
|
|
34
|
+
- **⚠️ MANDATORY BEFORE GIT PUSH**: `bundle exec rubocop` and fix ALL violations + ensure trailing newlines
|
|
23
35
|
|
|
24
36
|
### Development Setup Commands
|
|
25
37
|
|
data/Gemfile.lock
CHANGED
data/LICENSE.md
CHANGED
|
@@ -5,7 +5,12 @@
|
|
|
5
5
|
|
|
6
6
|
---
|
|
7
7
|
|
|
8
|
-
|
|
8
|
+
## MIT License for Core React on Rails
|
|
9
|
+
|
|
10
|
+
This license applies to all files within this repository, with the exception of the code located in the following directories, which are licensed separately under the React on Rails Pro License:
|
|
11
|
+
|
|
12
|
+
- `lib/react_on_rails/pro/`
|
|
13
|
+
- `node_package/src/pro/`
|
|
9
14
|
|
|
10
15
|
Copyright (c) 2017, 2018 Justin Gordon and ShakaCode
|
|
11
16
|
Copyright (c) 2015–2025 ShakaCode, LLC
|
|
@@ -31,3 +36,12 @@ AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
|
31
36
|
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
32
37
|
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
33
38
|
SOFTWARE.
|
|
39
|
+
|
|
40
|
+
---
|
|
41
|
+
|
|
42
|
+
## React on Rails Pro License
|
|
43
|
+
|
|
44
|
+
The code in the directories listed above is part of the React on Rails Pro framework and is licensed under the React on Rails Pro License.
|
|
45
|
+
|
|
46
|
+
You can find the full text of the license agreement here:
|
|
47
|
+
[REACT-ON-RAILS-PRO-LICENSE.md](./REACT-ON-RAILS-PRO-LICENSE.md)
|
data/README.md
CHANGED
|
@@ -9,7 +9,7 @@
|
|
|
9
9
|
|
|
10
10
|
---
|
|
11
11
|
|
|
12
|
-
[](LICENSE.md)[](https://badge.fury.io/rb/react_on_rails) [](https://badge.fury.io/js/react-on-rails) [](LICENSE.md)[](https://badge.fury.io/rb/react_on_rails) [](https://badge.fury.io/js/react-on-rails) [](https://coveralls.io/github/shakacode/react_on_rails?branch=master) [](https://rubygems.org/gems/react_on_rails)
|
|
13
13
|
|
|
14
14
|
[](https://github.com/shakacode/react_on_rails/actions/workflows/main.yml)
|
|
15
15
|
[](https://github.com/shakacode/react_on_rails/actions/workflows/package-js-tests.yml)
|
|
@@ -18,13 +18,18 @@
|
|
|
18
18
|
|
|
19
19
|
# News
|
|
20
20
|
|
|
21
|
+
**🚀 React on Rails v16.0 Released!** Major modernization with ESM support, enhanced React Server Components, and streamlined configuration.
|
|
22
|
+
|
|
23
|
+
- **ESM-only package**: Modern module system with better tree-shaking and performance
|
|
24
|
+
- **React Server Components**: Improved rendering flow and new `RSCRoute` component for seamless SSR
|
|
25
|
+
- **Performance improvements**: New async loading strategies and optimized bundle generation
|
|
26
|
+
- **Webpacker removal**: Streamlined for Shakapacker-only support (>= 6.0)
|
|
21
27
|
- [React on Rails Pro](https://www.shakacode.com/react-on-rails-pro/) supports the latest features of React 18, including [React Server Components](https://react.dev/reference/rsc/server-components) and [streaming](https://react.dev/reference/react-dom/server/renderToPipeableStream). Contact [Justin Gordon](mailto:justin@shakacode.com) for more information.
|
|
22
28
|
- ShakaCode now maintains the official successor to `rails/webpacker`, [`shakapacker`](https://github.com/shakacode/shakapacker).
|
|
23
|
-
- Project is updated to support Rails 7 and Shakapacker v6+!
|
|
24
29
|
|
|
25
30
|
---
|
|
26
31
|
|
|
27
|
-
_These are the docs for React on Rails
|
|
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)._
|
|
28
33
|
|
|
29
34
|
# About
|
|
30
35
|
|
|
@@ -42,16 +47,55 @@ We also specialize in helping development teams lower infrastructure and CI cost
|
|
|
42
47
|
|
|
43
48
|
If you think ShakaCode can help your project, [click here](https://meetings.hubspot.com/justingordon/30-minute-consultation) to book a call with [Justin Gordon](mailto:justin@shakacode.com), the creator of React on Rails.
|
|
44
49
|
|
|
50
|
+
## Upgrading React on Rails
|
|
51
|
+
|
|
52
|
+
After upgrading to a new major version, run the generator to get latest defaults:
|
|
53
|
+
|
|
54
|
+
```bash
|
|
55
|
+
rails generate react_on_rails:install
|
|
56
|
+
```
|
|
57
|
+
|
|
58
|
+
**Important**: Review changes carefully before applying to avoid overwriting custom configurations. The generator updates:
|
|
59
|
+
|
|
60
|
+
- `bin/dev` (improved development workflow)
|
|
61
|
+
- webpack configurations
|
|
62
|
+
- `shakapacker.yml` settings
|
|
63
|
+
- other configuration files
|
|
64
|
+
|
|
65
|
+
### Troubleshooting Setup Issues
|
|
66
|
+
|
|
67
|
+
If you encounter issues during installation or after upgrading, use the doctor command to diagnose your setup:
|
|
68
|
+
|
|
69
|
+
```bash
|
|
70
|
+
rake react_on_rails:doctor
|
|
71
|
+
```
|
|
72
|
+
|
|
73
|
+
The doctor command checks your environment, dependencies, and configuration files to identify potential issues. Use `VERBOSE=true rake react_on_rails:doctor` for detailed output.
|
|
74
|
+
|
|
75
|
+
For detailed upgrade instructions, see [upgrade guide documentation](docs/guides/upgrading-react-on-rails.md).
|
|
76
|
+
|
|
45
77
|
## React on Rails Pro
|
|
46
78
|
|
|
47
|
-
|
|
79
|
+
Some features of React on Rails regarding performance require a React on Rails Pro subscription.
|
|
80
|
+
|
|
81
|
+
Note: the subscription price is free for evaluation and non-production use.
|
|
82
|
+
|
|
83
|
+
Notable new features include:
|
|
84
|
+
|
|
85
|
+
- React Server Components
|
|
86
|
+
- Streaming SSR
|
|
87
|
+
- Loadable Components
|
|
88
|
+
- Code Splitting with React Router
|
|
89
|
+
|
|
90
|
+
React on Rails Pro is the best way to optimize your Webpack setup for React on Rails, including code splitting with [React Router](https://reactrouter.com/) and [loadable-components](https://loadable-components.com/) with server-side rendering for SEO and hot-reloading for developers.
|
|
91
|
+
|
|
48
92
|
We did this for Popmenu, [lowering Heroku costs 20-25% while getting a 73% decrease in average response times](https://www.shakacode.com/recent-work/popmenu/). Several years later, Popmenu serves tens of millions of SSR requests daily with React on Rails Pro.
|
|
49
93
|
|
|
50
94
|
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).
|
|
51
95
|
|
|
52
96
|
# Documentation
|
|
53
97
|
|
|
54
|
-
See the documentation at **[shakacode.com/react-on-rails/docs](https://www.shakacode.com/react-on-rails/docs/)
|
|
98
|
+
See the documentation at **[shakacode.com/react-on-rails/docs](https://www.shakacode.com/react-on-rails/docs/)** and [React on Rails Pro](https://www.shakacode.com/react-on-rails-pro/).
|
|
55
99
|
|
|
56
100
|
## Project Objective
|
|
57
101
|
|
|
@@ -61,18 +105,20 @@ To provide a high-performance framework for integrating Ruby on Rails with React
|
|
|
61
105
|
|
|
62
106
|
Given that `shakacode/shakapacker` gem already provides basic React integration, why would you use "React on Rails"?
|
|
63
107
|
|
|
64
|
-
1.
|
|
65
|
-
1.
|
|
66
|
-
1.
|
|
67
|
-
|
|
68
|
-
1.
|
|
69
|
-
|
|
70
|
-
1.
|
|
71
|
-
1. [
|
|
72
|
-
1.
|
|
73
|
-
1. [
|
|
74
|
-
|
|
75
|
-
|
|
108
|
+
1. **Modern ESM-only package** with optimized tree-shaking for smaller bundle sizes and better performance.
|
|
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)**.
|
|
120
|
+
|
|
121
|
+
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.
|
|
76
122
|
|
|
77
123
|
## Online demo
|
|
78
124
|
|
|
@@ -88,7 +134,11 @@ _Requires creating a free account._
|
|
|
88
134
|
|
|
89
135
|
## Prerequisites
|
|
90
136
|
|
|
91
|
-
Ruby on Rails >=5
|
|
137
|
+
- Ruby on Rails >= 5
|
|
138
|
+
- Shakapacker >= 6.0 (Webpacker is no longer supported as of v16)
|
|
139
|
+
- Ruby >= 3.2 (CI tested: 3.2 - 3.4)
|
|
140
|
+
- Node.js >= 20 (CI tested: 20 - 22)
|
|
141
|
+
- A JavaScript package manager (npm, yarn, pnpm, or bun)
|
|
92
142
|
|
|
93
143
|
# Support
|
|
94
144
|
|
data/eslint.config.ts
CHANGED
|
@@ -44,6 +44,9 @@ const config = tsEslint.config([
|
|
|
44
44
|
// fixtures
|
|
45
45
|
'**/fixtures/',
|
|
46
46
|
'**/.yalc/**/*',
|
|
47
|
+
// generator templates - exclude TypeScript templates that need tsconfig.json
|
|
48
|
+
'**/templates/**/*.tsx',
|
|
49
|
+
'**/templates/**/*.ts',
|
|
47
50
|
]),
|
|
48
51
|
{
|
|
49
52
|
files: ['**/*.[jt]s', '**/*.[jt]sx', '**/*.[cm][jt]s'],
|
data/knip.ts
CHANGED
|
@@ -6,21 +6,32 @@ const config: KnipConfig = {
|
|
|
6
6
|
'.': {
|
|
7
7
|
entry: [
|
|
8
8
|
'node_package/src/ReactOnRails.node.ts!',
|
|
9
|
-
'node_package/src/ReactOnRailsRSC.ts!',
|
|
10
|
-
'node_package/src/registerServerComponent/client.tsx!',
|
|
11
|
-
'node_package/src/registerServerComponent/server.tsx!',
|
|
12
|
-
'node_package/src/registerServerComponent/server.rsc.ts!',
|
|
13
|
-
'node_package/src/wrapServerComponentRenderer/server.tsx!',
|
|
14
|
-
'node_package/src/wrapServerComponentRenderer/server.rsc.tsx!',
|
|
15
|
-
'node_package/src/RSCRoute.tsx!',
|
|
16
|
-
'node_package/src/ServerComponentFetchError.ts!',
|
|
9
|
+
'node_package/src/pro/ReactOnRailsRSC.ts!',
|
|
10
|
+
'node_package/src/pro/registerServerComponent/client.tsx!',
|
|
11
|
+
'node_package/src/pro/registerServerComponent/server.tsx!',
|
|
12
|
+
'node_package/src/pro/registerServerComponent/server.rsc.ts!',
|
|
13
|
+
'node_package/src/pro/wrapServerComponentRenderer/server.tsx!',
|
|
14
|
+
'node_package/src/pro/wrapServerComponentRenderer/server.rsc.tsx!',
|
|
15
|
+
'node_package/src/pro/RSCRoute.tsx!',
|
|
16
|
+
'node_package/src/pro/ServerComponentFetchError.ts!',
|
|
17
|
+
'node_package/src/pro/getReactServerComponent.server.ts!',
|
|
18
|
+
'node_package/src/pro/transformRSCNodeStream.ts!',
|
|
19
|
+
'node_package/src/loadJsonFile.ts!',
|
|
17
20
|
'eslint.config.ts',
|
|
18
21
|
],
|
|
19
22
|
project: ['node_package/src/**/*.[jt]s{x,}!', 'node_package/tests/**/*.[jt]s{x,}'],
|
|
20
23
|
babel: {
|
|
21
24
|
config: ['node_package/babel.config.js'],
|
|
22
25
|
},
|
|
23
|
-
ignore: [
|
|
26
|
+
ignore: [
|
|
27
|
+
'node_package/tests/emptyForTesting.js',
|
|
28
|
+
// Pro features exported for external consumption
|
|
29
|
+
'node_package/src/pro/streamServerRenderedReactComponent.ts:transformRenderStreamChunksToResultObject',
|
|
30
|
+
'node_package/src/pro/streamServerRenderedReactComponent.ts:streamServerRenderedComponent',
|
|
31
|
+
'node_package/src/pro/ServerComponentFetchError.ts:isServerComponentFetchError',
|
|
32
|
+
'node_package/src/pro/RSCRoute.tsx:RSCRouteProps',
|
|
33
|
+
'node_package/src/pro/streamServerRenderedReactComponent.ts:StreamingTrackers',
|
|
34
|
+
],
|
|
24
35
|
ignoreBinaries: [
|
|
25
36
|
// Knip fails to detect it's declared in devDependencies
|
|
26
37
|
'nps',
|
|
@@ -0,0 +1,65 @@
|
|
|
1
|
+
Description:
|
|
2
|
+
The `react_on_rails:doctor` generator diagnoses your React on Rails setup
|
|
3
|
+
and identifies potential configuration issues. It performs comprehensive
|
|
4
|
+
checks on your environment, dependencies, and configuration files.
|
|
5
|
+
|
|
6
|
+
This command is especially useful for:
|
|
7
|
+
• Troubleshooting setup issues
|
|
8
|
+
• Verifying installation after running react_on_rails:install
|
|
9
|
+
• Ensuring compatibility after upgrades
|
|
10
|
+
• Getting help with configuration problems
|
|
11
|
+
|
|
12
|
+
Example:
|
|
13
|
+
# Basic diagnosis
|
|
14
|
+
rails generate react_on_rails:doctor
|
|
15
|
+
|
|
16
|
+
# Verbose output showing all checks
|
|
17
|
+
rails generate react_on_rails:doctor --verbose
|
|
18
|
+
|
|
19
|
+
# Show help
|
|
20
|
+
rails generate react_on_rails:doctor --help
|
|
21
|
+
|
|
22
|
+
Checks performed:
|
|
23
|
+
Environment Prerequisites:
|
|
24
|
+
• Node.js installation and version compatibility
|
|
25
|
+
• JavaScript package manager availability (npm, yarn, pnpm, bun)
|
|
26
|
+
• Git working directory status
|
|
27
|
+
|
|
28
|
+
React on Rails Packages:
|
|
29
|
+
• React on Rails gem installation
|
|
30
|
+
• react-on-rails NPM package installation
|
|
31
|
+
• Version synchronization between gem and NPM package
|
|
32
|
+
• Shakapacker configuration and installation
|
|
33
|
+
|
|
34
|
+
Dependencies:
|
|
35
|
+
• React and React DOM installation
|
|
36
|
+
• Babel preset configuration
|
|
37
|
+
• Required development dependencies
|
|
38
|
+
|
|
39
|
+
Rails Integration:
|
|
40
|
+
• React on Rails initializer configuration
|
|
41
|
+
• Route and controller setup (Hello World example)
|
|
42
|
+
• View helper integration
|
|
43
|
+
|
|
44
|
+
Webpack Configuration:
|
|
45
|
+
• Webpack config file existence and structure
|
|
46
|
+
• React on Rails compatibility checks
|
|
47
|
+
• Environment-specific configuration validation
|
|
48
|
+
|
|
49
|
+
Development Environment:
|
|
50
|
+
• JavaScript bundle files
|
|
51
|
+
• Procfile.dev for development workflow
|
|
52
|
+
• .gitignore configuration for generated files
|
|
53
|
+
|
|
54
|
+
Options:
|
|
55
|
+
--verbose, -v: Show detailed output for all checks, including successful ones
|
|
56
|
+
--fix, -f: Attempt to fix simple issues automatically (planned feature)
|
|
57
|
+
|
|
58
|
+
Exit codes:
|
|
59
|
+
0: All checks passed or only warnings found
|
|
60
|
+
1: Critical errors found that prevent React on Rails from working
|
|
61
|
+
|
|
62
|
+
For more help:
|
|
63
|
+
• Documentation: https://github.com/shakacode/react_on_rails
|
|
64
|
+
• Issues: https://github.com/shakacode/react_on_rails/issues
|
|
65
|
+
• Discord: https://discord.gg/reactrails
|
|
@@ -105,13 +105,13 @@ module ReactOnRails
|
|
|
105
105
|
def install_js_dependencies
|
|
106
106
|
# Detect which package manager to use
|
|
107
107
|
success = if File.exist?(File.join(destination_root, "yarn.lock"))
|
|
108
|
-
|
|
108
|
+
system("yarn", "install")
|
|
109
109
|
elsif File.exist?(File.join(destination_root, "pnpm-lock.yaml"))
|
|
110
|
-
|
|
110
|
+
system("pnpm", "install")
|
|
111
111
|
elsif File.exist?(File.join(destination_root, "package-lock.json")) ||
|
|
112
112
|
File.exist?(File.join(destination_root, "package.json"))
|
|
113
113
|
# Use npm for package-lock.json or as default fallback
|
|
114
|
-
|
|
114
|
+
system("npm", "install")
|
|
115
115
|
else
|
|
116
116
|
true # No package manager detected, skip
|
|
117
117
|
end
|
|
@@ -173,7 +173,7 @@ module ReactOnRails
|
|
|
173
173
|
return if add_npm_dependencies(react_on_rails_pkg)
|
|
174
174
|
|
|
175
175
|
puts "Using direct npm commands as fallback"
|
|
176
|
-
success =
|
|
176
|
+
success = system("npm", "install", *react_on_rails_pkg)
|
|
177
177
|
handle_npm_failure("react-on-rails package", react_on_rails_pkg) unless success
|
|
178
178
|
end
|
|
179
179
|
|
|
@@ -189,7 +189,7 @@ module ReactOnRails
|
|
|
189
189
|
]
|
|
190
190
|
return if add_npm_dependencies(react_deps)
|
|
191
191
|
|
|
192
|
-
success =
|
|
192
|
+
success = system("npm", "install", *react_deps)
|
|
193
193
|
handle_npm_failure("React dependencies", react_deps) unless success
|
|
194
194
|
end
|
|
195
195
|
|
|
@@ -203,7 +203,7 @@ module ReactOnRails
|
|
|
203
203
|
]
|
|
204
204
|
return if add_npm_dependencies(css_deps)
|
|
205
205
|
|
|
206
|
-
success =
|
|
206
|
+
success = system("npm", "install", *css_deps)
|
|
207
207
|
handle_npm_failure("CSS dependencies", css_deps) unless success
|
|
208
208
|
end
|
|
209
209
|
|
|
@@ -215,7 +215,7 @@ module ReactOnRails
|
|
|
215
215
|
]
|
|
216
216
|
return if add_npm_dependencies(dev_deps, dev: true)
|
|
217
217
|
|
|
218
|
-
success =
|
|
218
|
+
success = system("npm", "install", "--save-dev", *dev_deps)
|
|
219
219
|
handle_npm_failure("development dependencies", dev_deps, dev: true) unless success
|
|
220
220
|
end
|
|
221
221
|
|