react_on_rails 6.6.0.alpha.1 → 6.6.0
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/.bookignore +0 -1
- data/.gitignore +2 -0
- data/.travis.yml +3 -3
- data/CHANGELOG.md +6 -1
- data/CONTRIBUTING.md +15 -35
- data/Gemfile +0 -1
- data/PROJECTS.md +5 -1
- data/README.md +9 -9
- data/SUMMARY.md +1 -1
- data/app/helpers/react_on_rails_helper.rb +20 -27
- data/docs/additional-reading/heroku-deployment.md +1 -1
- data/docs/additional-reading/hot-reloading-rails-development.md +4 -4
- data/docs/additional-reading/node-dependencies-and-npm.md +8 -18
- data/docs/additional-reading/node-server-rendering.md +1 -1
- data/docs/additional-reading/rspec-configuration.md +3 -3
- data/docs/additional-reading/turbolinks.md +2 -2
- data/docs/additional-reading/updating-dependencies.md +4 -6
- data/docs/contributor-info/generator-testing.md +1 -1
- data/docs/tutorial.md +6 -4
- data/lib/generators/USAGE +2 -2
- data/lib/generators/react_on_rails/base_generator.rb +2 -2
- data/lib/generators/react_on_rails/dev_tests_generator.rb +1 -1
- data/lib/generators/react_on_rails/install_generator.rb +3 -3
- data/lib/generators/react_on_rails/templates/base/base/Procfile.dev.tt +1 -1
- data/lib/generators/react_on_rails/templates/base/base/config/initializers/react_on_rails.rb.tt +3 -3
- data/lib/generators/react_on_rails/templates/base/base/package.json.tt +1 -1
- data/lib/react_on_rails/test_helper.rb +1 -1
- data/lib/react_on_rails/test_helper/node_process_launcher.rb +1 -1
- data/lib/react_on_rails/version.rb +1 -1
- data/lib/react_on_rails/version_checker.rb +1 -1
- data/package.json +13 -13
- data/rakelib/dummy_apps.rake +2 -2
- data/rakelib/example_type.rb +2 -2
- data/rakelib/examples.rake +2 -2
- data/rakelib/lint.rake +2 -2
- data/rakelib/node_package.rake +1 -1
- data/rakelib/release.rake +5 -5
- data/rakelib/run_rspec.rake +3 -3
- data/react_on_rails.gemspec +0 -2
- data/yarn.lock +359 -1066
- metadata +4 -19
- data/npm-shrinkwrap.json +0 -4177
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA1:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: 9df3146f1b1852d86faa068f5d22dc82ac0a29d5
|
4
|
+
data.tar.gz: e3850f41f59ac558263173e8407088b2c18f0c5b
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: c36020f6688cc06c004eba51a42b543c0d206e0b9664e544b04c3b5f0542af65ed875baf78923e905b7b5fc08999687cdb4c35506b7009c366588e9ec953d2f6
|
7
|
+
data.tar.gz: 101064964aa15e85d333dba3c6ebfd053834e3770b7f14569249fc20f67ba639df80fbf81d66954a8eda445227ea30e95d4ae06477009b973f87262d5beee5c9
|
data/.bookignore
CHANGED
data/.gitignore
CHANGED
data/.travis.yml
CHANGED
@@ -15,6 +15,7 @@ cache:
|
|
15
15
|
bundler: true
|
16
16
|
directories:
|
17
17
|
- node_modules # NPM packages
|
18
|
+
yarn: true
|
18
19
|
|
19
20
|
gemfile:
|
20
21
|
- spec/dummy/Gemfile
|
@@ -37,9 +38,8 @@ before_install:
|
|
37
38
|
install:
|
38
39
|
- nvm install node
|
39
40
|
- node -v
|
40
|
-
- npm
|
41
|
-
-
|
42
|
-
- npm install
|
41
|
+
- npm i -g yarn@0.20.3
|
42
|
+
- yarn
|
43
43
|
- bundle install
|
44
44
|
- rake dummy_apps
|
45
45
|
- rake examples
|
data/CHANGELOG.md
CHANGED
@@ -6,6 +6,10 @@ Contributors: please follow the recommendations outlined at [keepachangelog.com]
|
|
6
6
|
## [Unreleased]
|
7
7
|
*Please add entries here for your pull requests.*
|
8
8
|
|
9
|
+
## [6.6.0] - 2017-02-18
|
10
|
+
### Added
|
11
|
+
- Switched to yarn! [#715](https://github.com/shakacode/react_on_rails/pull/715) by [squadette](https://github.com/squadette).
|
12
|
+
|
9
13
|
## [6.5.1] - 2017-02-11
|
10
14
|
### Fixed
|
11
15
|
- Allow using gem without sprockets. [#671](https://github.com/shakacode/react_on_rails/pull/671) by [fc-arny](https://github.com/fc-arny).
|
@@ -448,7 +452,8 @@ Best done with Object destructing:
|
|
448
452
|
##### Fixed
|
449
453
|
- Fix several generator related issues.
|
450
454
|
|
451
|
-
[Unreleased]: https://github.com/shakacode/react_on_rails/compare/6.
|
455
|
+
[Unreleased]: https://github.com/shakacode/react_on_rails/compare/6.6.0...master
|
456
|
+
[6.6.0]: https://github.com/shakacode/react_on_rails/compare/6.5.1...6.6.0
|
452
457
|
[6.5.1]: https://github.com/shakacode/react_on_rails/compare/6.5.0...6.5.1
|
453
458
|
[6.5.0]: https://github.com/shakacode/react_on_rails/compare/6.4.2...6.5.0
|
454
459
|
[6.4.2]: https://github.com/shakacode/react_on_rails/compare/6.4.1...6.4.2
|
data/CONTRIBUTING.md
CHANGED
@@ -45,12 +45,12 @@ When making doc changes, we want the change to work on both the gitbook and the
|
|
45
45
|
* After updating code via git, to prepare all examples and run all tests:
|
46
46
|
|
47
47
|
```
|
48
|
-
bundle &&
|
48
|
+
bundle && yarn && rake examples:prepare_all && rake node_package && rake
|
49
49
|
```
|
50
50
|
|
51
51
|
In order to run tests in browser
|
52
52
|
```
|
53
|
-
|
53
|
+
yarn global add browserify babelify tape-run faucet
|
54
54
|
browserify -t babelify node_package/tests/*.js | tape-run | faucet
|
55
55
|
```
|
56
56
|
|
@@ -86,37 +86,17 @@ Note that you will need to bundle install after making this change, but also tha
|
|
86
86
|
First, be **sure** to build the NPM package
|
87
87
|
|
88
88
|
```sh
|
89
|
-
|
90
|
-
|
89
|
+
yarn
|
90
|
+
yarn run build
|
91
91
|
```
|
92
92
|
|
93
93
|
Use a relative path in your `package.json`, like this:
|
94
94
|
```sh
|
95
95
|
cd client
|
96
|
-
|
96
|
+
yarn add "react-on-rails@../../react_on_rails"
|
97
97
|
```
|
98
98
|
|
99
|
-
When you use a relative path, be sure to run the above `
|
100
|
-
|
101
|
-
While we'd prefer to use `npm link`, we get errors. If you can figure out how to get `npm link react-on-rails` to work with this project, please file an issue or PR! This used to work with babel 5.
|
102
|
-
|
103
|
-
This is the error:
|
104
|
-
|
105
|
-
```
|
106
|
-
16:34:11 rails-client-assets.1 | ERROR in /react_on_rails/node_package/lib/ReactOnRails.js
|
107
|
-
16:34:11 rails-client-assets.1 | Module build failed: ReferenceError: Unknown plugin "react-transform" specified in "base" at 0, attempted to resolve relative to "/react_on_rails/node_package/lib"
|
108
|
-
16:34:11 rails-client-assets.1 | at /react-webpack-rails-tutorial/client/node_modules/babel-core/lib/transformation/file/options/option-manager.js:193:17
|
109
|
-
16:34:11 rails-client-assets.1 | at Array.map (native)
|
110
|
-
16:34:11 rails-client-assets.1 | at Function.normalisePlugins (/react-webpack-rails-tutorial/client/node_modules/babel-core/lib/transformation/file/options/option-manager.js:173:20)
|
111
|
-
16:34:11 rails-client-assets.1 | at OptionManager.mergeOptions (/react-webpack-rails-tutorial/client/node_modules/babel-core/lib/transformation/file/options/option-manager.js:271:36)
|
112
|
-
16:34:11 rails-client-assets.1 | at OptionManager.init (/react-webpack-rails-tutorial/client/node_modules/babel-core/lib/transformation/file/options/option-manager.js:416:10)
|
113
|
-
16:34:11 rails-client-assets.1 | at File.initOptions (/react-webpack-rails-tutorial/client/node_modules/babel-core/lib/transformation/file/index.js:191:75)
|
114
|
-
16:34:11 rails-client-assets.1 | at new File (/react-webpack-rails-tutorial/client/node_modules/babel-core/lib/transformation/file/index.js:122:22)
|
115
|
-
16:34:11 rails-client-assets.1 | at Pipeline.transform (/react-webpack-rails-tutorial/client/node_modules/babel-core/lib/transformation/pipeline.js:42:16)
|
116
|
-
16:34:11 rails-client-assets.1 | at transpile (/react-webpack-rails-tutorial/client/node_modules/babel-loader/index.js:14:22)
|
117
|
-
16:34:11 rails-client-assets.1 | at Object.module.exports (/react-webpack-rails-tutorial/client/node_modules/babel-loader/index.js:88:12)
|
118
|
-
16:34:11 rails-client-assets.1 | @ ./app/bundles/comments/startup/clientRegistration.jsx 15:20-45
|
119
|
-
```
|
99
|
+
When you use a relative path, be sure to run the above `yarn` command whenever you change the node package for react-on-rails.
|
120
100
|
|
121
101
|
# Development Setup for Gem and Node Package Contributors
|
122
102
|
|
@@ -133,16 +113,16 @@ After checking out the repo, making sure you have rvm and nvm setup (setup ruby
|
|
133
113
|
Additionally, our RSpec tests use the poltergeist web driver. You will need to install the phantomjs node module:
|
134
114
|
|
135
115
|
```sh
|
136
|
-
|
116
|
+
yarn global add phantomjs
|
137
117
|
```
|
138
118
|
|
139
119
|
Note this *must* be installed globally for the dummy test project rspec runner to see it properly.
|
140
120
|
|
141
121
|
### Local Node Package
|
142
|
-
Because the example and dummy apps rely on the react-on-rails node package, they should link directly to your local version to pick up any changes you may have made to that package. To achieve this, switch to the
|
122
|
+
Because the example and dummy apps rely on the react-on-rails node package, they should link directly to your local version to pick up any changes you may have made to that package. To achieve this, switch to the test app's root directory and run this command below which runs something like [this script](spec/dummy/package.json#L14)
|
143
123
|
|
144
124
|
```sh
|
145
|
-
|
125
|
+
yarn run install-react-on-rails
|
146
126
|
```
|
147
127
|
|
148
128
|
From now on, the example and dummy apps will use your local node_package folder as the react-on-rails node package. This will also be done automatically for you via the `rake examples:prepare_all` rake task.
|
@@ -162,11 +142,11 @@ From now on, the example and dummy apps will use your local node_package folder
|
|
162
142
|
|
163
143
|
```sh
|
164
144
|
cd <top level>
|
165
|
-
|
145
|
+
yarn
|
166
146
|
npm build
|
167
147
|
```
|
168
148
|
|
169
|
-
Or run this which builds the
|
149
|
+
Or run this which builds the yarn package, then the webpack files for spec/dummy, and runs tests in
|
170
150
|
spec/dummy.
|
171
151
|
|
172
152
|
|
@@ -174,14 +154,14 @@ spec/dummy.
|
|
174
154
|
# Optionally change default selenium_firefox driver
|
175
155
|
export DRIVER=poltergeist
|
176
156
|
cd <top level>
|
177
|
-
|
157
|
+
yarn run dummy:spec
|
178
158
|
```
|
179
159
|
|
180
160
|
### Run NPM JS tests
|
181
161
|
|
182
162
|
```sh
|
183
163
|
cd <top level>
|
184
|
-
|
164
|
+
yarn test
|
185
165
|
```
|
186
166
|
|
187
167
|
### Run spec/dummy tests
|
@@ -195,7 +175,7 @@ Eventually, we may have JS tests:
|
|
195
175
|
|
196
176
|
```sh
|
197
177
|
cd spec/dummy/client
|
198
|
-
|
178
|
+
yarn run test
|
199
179
|
```
|
200
180
|
|
201
181
|
### Run most tests and linting
|
@@ -206,7 +186,7 @@ npm run check
|
|
206
186
|
```
|
207
187
|
|
208
188
|
### Starting the Dummy App
|
209
|
-
To run the test app, it's **CRITICAL** to not just run `rails s`. You have to run `foreman start`. If you don't do this, then `webpack` will not generate a new bundle, and you will be seriously confused when you change JavaScript and the app does not change. If you change the webpack configs, then you need to restart foreman. If you change the JS code for react-on-rails, you need to run `
|
189
|
+
To run the test app, it's **CRITICAL** to not just run `rails s`. You have to run `foreman start`. If you don't do this, then `webpack` will not generate a new bundle, and you will be seriously confused when you change JavaScript and the app does not change. If you change the webpack configs, then you need to restart foreman. If you change the JS code for react-on-rails, you need to run `yarn run build`. Since the react-on-rails package should be sym linked, you don't have to `yarn react-on-rails` after every change.
|
210
190
|
|
211
191
|
### RSpec Testing
|
212
192
|
Run `rake` for testing the gem and `spec/dummy`. Otherwise, the `rspec` command only works for testing within the sample apps, like `spec/dummy`.
|
data/Gemfile
CHANGED
data/PROJECTS.md
CHANGED
@@ -9,7 +9,7 @@
|
|
9
9
|
* **[Pivotal Tracker](http://www.pivotaltracker.com/)**: The first (and most-loved) agile project management tool built on Rails. React on Rails has greatly simplified integration and workflow for our React components in Rails!
|
10
10
|
* **[Blink Inc](https://www.blinkinc.com)**: Website and more built by [ShakaCode](http://www.shakacode.com).
|
11
11
|
* **[Madrone Analytics](http://madroneco.com/)**: The original client of [ShakaCode](http://www.shakacode.com) that led to the development of React on Rails, as described in [Fast Rich Client Rails Development With Webpack and the ES6 Transpiler](http://www.railsonmaui.com/blog/2014/10/03/integrating-webpack-and-the-es6-transpiler-into-an-existing-rails-project/).
|
12
|
-
* **[Deliveroo](https://deliveroo.co.uk/)**: The leading food delivery site in Europe has gone live with React on Rails, with multi-lingual JavaScript support!
|
12
|
+
* **[Deliveroo](https://deliveroo.co.uk/)**: The leading food delivery site in Europe has gone live with React on Rails, with multi-lingual JavaScript support!
|
13
13
|
![2016-05-03_19-18-34](https://cloud.githubusercontent.com/assets/1118459/15027253/91fd151a-11de-11e6-93e3-720518995fe0.png)
|
14
14
|
* **[Airgoat](https://airgoat.com/)**: Marketplace for sneakers.
|
15
15
|
* **[Apprentus](https://www.apprentus.com/)**: A marketplace to find the best private teachers. Using react-on-rails from the homepage to infinity!
|
@@ -17,6 +17,10 @@
|
|
17
17
|
* **[Flyhomes](https://www.flyhomes.com/)**: Real estate brokerage service that awards frequent flyer miles.
|
18
18
|
* **[Undeveloped](https://undeveloped.com/)**: Buy and sell domain names. ![image](https://cloud.githubusercontent.com/assets/1118459/19623703/7c6d63d0-9870-11e6-83f2-8b83ca49daa9.png)
|
19
19
|
* **[Foxford.ru](http://foxford.ru/)**: Online School ![2016-12-17_13-23-21](https://cloud.githubusercontent.com/assets/1118459/21290377/1adacdf2-c45c-11e6-97c1-f726ab749b2d.png)
|
20
|
+
* **[CareerBuilder for Employers](https://hiring.careerbuilder.com/)**: CareerBuilder's marketing/ecommerce website. We've integrated React on Rails and have deployed the application via Cloud 66, and are busy integrating this into other projects!
|
21
|
+
|
22
|
+
## Open Source Projects Live
|
23
|
+
* [github.com/empirical-org/Empirical-Core](https://github.com/empirical-org/Empirical-Core): [Quill.org](https://quill.org/) Provides free tools to make your students better writers.
|
20
24
|
|
21
25
|
## Demos and Tutorials
|
22
26
|
* [reactrails.com](http://www.reactrails.com), source code [github.com/shakacode/react-webpack-rails-tutorial](https://github.com/shakacode/react-webpack-rails-tutorial/)
|
data/README.md
CHANGED
@@ -2,7 +2,7 @@
|
|
2
2
|
|
3
3
|
**For a complete example of this gem, see our live demo at [www.reactrails.com](http://www.reactrails.com). ([Source Code](https://github.com/shakacode/react-webpack-rails-tutorial))**
|
4
4
|
|
5
|
-
Aloha from Justin Gordon ([bio](http://www.railsonmaui.com/about)) and the [ShakaCode](http://www.shakacode.com) Team! We're actively looking for new projects involving React, React-Native, and Rails. Please [contact me](mailto:justin@shakacode.com) if we could potentially help you in any way. Besides consulting on bigger projects, [ShakaCode](http://www.shakacode.com) is doing ScreenHero plus Slack/Github based coaching for React on Rails. See our blog post [Can ShakaCode Help You?](https://blog.shakacode.com/can-shakacode-help-you-4a5b1e5a8a63#.jex6tg9w9) for more information.
|
5
|
+
Aloha from Justin Gordon ([bio](http://www.railsonmaui.com/about)) and the [ShakaCode](http://www.shakacode.com) Team! We're actively looking for new projects involving React, React-Native, and Rails. Please [contact me](mailto:justin@shakacode.com) if we could potentially help you in any way. Besides consulting on bigger projects, [ShakaCode](http://www.shakacode.com) is doing ScreenHero plus Slack/Github based coaching for React on Rails. See our blog post [Can ShakaCode Help You?](https://blog.shakacode.com/can-shakacode-help-you-4a5b1e5a8a63#.jex6tg9w9) for more information.
|
6
6
|
|
7
7
|
I'm offering a free half-hour project consultation, on anything from React on Rails to any aspect of web application development for both consumer and enterprise products. In addition to React.js and Rails, we're doing React-Native iOS and Android apps!
|
8
8
|
|
@@ -22,7 +22,7 @@ Please [Subscribe](https://app.mailerlite.com/webforms/landing/l1d9x5) to keep i
|
|
22
22
|
* **[@ShakaCode on Twitter](https://twitter.com/shakacode)**
|
23
23
|
|
24
24
|
# Testimonials
|
25
|
-
From Joel Hooks, Co-Founder, Chief Nerd at [egghead.io](https://egghead.io/), January 30, 2017:
|
25
|
+
From Joel Hooks, Co-Founder, Chief Nerd at [egghead.io](https://egghead.io/), January 30, 2017:
|
26
26
|
![2017-01-30_11-33-59](https://cloud.githubusercontent.com/assets/1118459/22443635/b3549fb4-e6e3-11e6-8ea2-6f589dc93ed3.png)
|
27
27
|
|
28
28
|
For more testimonials, see [Live Projects](PROJECTS.md) and [Kudos](./KUDOS.md).
|
@@ -34,7 +34,7 @@ For more testimonials, see [Live Projects](PROJECTS.md) and [Kudos](./KUDOS.md).
|
|
34
34
|
* [React on Rails, 2000+ 🌟 Stars](https://medium.com/shakacode/react-on-rails-2000-stars-32ff5cfacfbf#.6gmfb2gpy)
|
35
35
|
* [The React on Rails Doctrine](https://medium.com/@railsonmaui/the-react-on-rails-doctrine-3c59a778c724)
|
36
36
|
|
37
|
-
### Videos
|
37
|
+
### Videos
|
38
38
|
|
39
39
|
1. [egghead.io: Creating a component with React on Rails](https://egghead.io/lessons/react-creating-a-component-with-react-on-rails)
|
40
40
|
1. [egghead.io: Creating a redux component with React on Rails](https://egghead.io/lessons/react-add-redux-state-management-to-a-react-on-rails-project)
|
@@ -130,7 +130,7 @@ We're definitely not doing that. With react_on_rails, webpack is mainly generati
|
|
130
130
|
5. Bundle and NPM install. Make sure you are on a recent version of node. Please use at least Node v5. Bundle is for adding execJs. You can remove that if you are sure you will not server render.
|
131
131
|
|
132
132
|
```bash
|
133
|
-
bundle &&
|
133
|
+
bundle && yarn
|
134
134
|
```
|
135
135
|
|
136
136
|
6. Ensure that you have `foreman` installed: `gem install foreman`.
|
@@ -141,7 +141,7 @@ We're definitely not doing that. With react_on_rails, webpack is mainly generati
|
|
141
141
|
foreman start -f Procfile.dev
|
142
142
|
```
|
143
143
|
|
144
|
-
|
144
|
+
8. Visit [localhost:5000/hello_world](http://localhost:5000/hello_world). Note, `foreman` defaults to PORT 5000 unless you set the value of PORT in your environment. For example, you can `export PORT=3000` to use the Rails default port of 3000.
|
145
145
|
|
146
146
|
### Installation Summary
|
147
147
|
|
@@ -198,7 +198,7 @@ See the [How to add I18n](docs/basics/i18n.md) for a summary of adding I18n.
|
|
198
198
|
All JavaScript in React On Rails is loaded from npm: [react-on-rails](https://www.npmjs.com/package/react-on-rails). To manually install this (you did not use the generator), assuming you have a standard configuration, run this command:
|
199
199
|
|
200
200
|
```
|
201
|
-
cd client &&
|
201
|
+
cd client && yarn add react-on-rails
|
202
202
|
```
|
203
203
|
|
204
204
|
That will install the latest version and update your package.json.
|
@@ -494,7 +494,7 @@ If you are using [jquery-ujs](https://github.com/rails/jquery-ujs) for AJAX call
|
|
494
494
|
## Integration with Node
|
495
495
|
Node.js can be used as the backend for server-side rendering instead of [execJS](https://github.com/rails/execjs). Before you try this, consider the tradeoff of extra complexity with your deployments versus *potential* performance gains. We've found that using ExecJS with [mini_racer](https://github.com/discourse/mini_racer) to be "fast enough" so far. That being said, we've heard of other large websites using Node.js for better server rendering performance. See [Node.js for Server Rendering](docs/additional-reading/node-server-rendering.md) for more information.
|
496
496
|
|
497
|
-
## Additional Documentation
|
497
|
+
## Additional Documentation
|
498
498
|
**Try out our new [Documentation Gitbook](https://shakacode.gitbooks.io/react-on-rails/content/) for improved readability & reference!**
|
499
499
|
+ **Rails**
|
500
500
|
+ [Rails Assets](docs/additional-reading/rails-assets.md)
|
@@ -504,7 +504,7 @@ Node.js can be used as the backend for server-side rendering instead of [execJS]
|
|
504
504
|
+ [Turbolinks](docs/additional-reading/turbolinks.md)
|
505
505
|
|
506
506
|
+ **Javascript**
|
507
|
-
+ [Node Dependencies and
|
507
|
+
+ [Node Dependencies, NPM, and Yarn](docs/additional-reading/node-dependencies-and-npm.md)
|
508
508
|
+ [Babel](docs/additional-reading/babel.md)
|
509
509
|
+ [React Router](docs/additional-reading/react-router.md)
|
510
510
|
+ [React & Redux](docs/additional-reading/react-and-redux.md)
|
@@ -551,7 +551,7 @@ Node.js can be used as the backend for server-side rendering instead of [execJS]
|
|
551
551
|
+ [spec app](https://github.com/shakacode/react_on_rails/tree/master/spec/dummy): Great simple examples used for our tests.
|
552
552
|
```
|
553
553
|
cd spec/dummy
|
554
|
-
bundle &&
|
554
|
+
bundle && yarn
|
555
555
|
foreman start
|
556
556
|
```
|
557
557
|
|
data/SUMMARY.md
CHANGED
@@ -7,7 +7,7 @@
|
|
7
7
|
* [Turbolinks](docs/additional-reading/turbolinks.md)
|
8
8
|
|
9
9
|
### **Javascript**
|
10
|
-
* [Node Dependencies and
|
10
|
+
* [Node Dependencies, NPM, and Yarn](docs/additional-reading/node-dependencies-and-npm.md)
|
11
11
|
* [Babel](docs/additional-reading/babel.md)
|
12
12
|
* [React Router](docs/additional-reading/react-router.md)
|
13
13
|
* [React & Redux](docs/additional-reading/react-and-redux.md)
|
@@ -6,7 +6,6 @@
|
|
6
6
|
require "react_on_rails/prerender_error"
|
7
7
|
require "addressable/uri"
|
8
8
|
require "react_on_rails/utils"
|
9
|
-
require "yajl"
|
10
9
|
|
11
10
|
module ReactOnRailsHelper
|
12
11
|
include ReactOnRails::Utils::Required
|
@@ -104,13 +103,13 @@ module ReactOnRailsHelper
|
|
104
103
|
|
105
104
|
# Setup the page_loaded_js, which is the same regardless of prerendering or not!
|
106
105
|
# The reason is that React is smart about not doing extra work if the server rendering did its job.
|
107
|
-
|
106
|
+
|
108
107
|
component_specification_tag =
|
109
|
-
|
110
|
-
|
111
|
-
|
112
|
-
|
113
|
-
|
108
|
+
content_tag(:div,
|
109
|
+
"",
|
110
|
+
class: "js-react-on-rails-component",
|
111
|
+
style: options.style,
|
112
|
+
data: options.data)
|
114
113
|
|
115
114
|
# Create the HTML rendering part
|
116
115
|
result = server_rendered_react_component_html(options.props, options.name, options.dom_id,
|
@@ -175,7 +174,7 @@ module ReactOnRailsHelper
|
|
175
174
|
end
|
176
175
|
|
177
176
|
def sanitized_props_string(props)
|
178
|
-
props.is_a?(String) ?
|
177
|
+
props.is_a?(String) ? json_escape(props) : props.to_json
|
179
178
|
end
|
180
179
|
|
181
180
|
# Helper method to take javascript expression and returns the output from evaluating it.
|
@@ -226,36 +225,30 @@ module ReactOnRailsHelper
|
|
226
225
|
|
227
226
|
private
|
228
227
|
|
229
|
-
def json_safe_and_pretty(something)
|
230
|
-
if defined?(Rails) && Rails.env.development?
|
231
|
-
ERB::Util.json_escape(JSON.pretty_generate(something.as_json))
|
232
|
-
else
|
233
|
-
ERB::Util.json_escape(something.to_json)
|
234
|
-
end
|
235
|
-
end
|
236
|
-
|
237
228
|
# prepend the rails_context if not yet applied
|
238
229
|
def prepend_render_rails_context(render_value)
|
239
230
|
return render_value if @rendered_rails_context
|
240
231
|
|
241
|
-
data =
|
232
|
+
data = {
|
233
|
+
rails_context: rails_context(server_side: false)
|
234
|
+
}
|
242
235
|
|
243
236
|
@rendered_rails_context = true
|
244
237
|
|
245
|
-
rails_context_content = content_tag(:
|
246
|
-
"
|
247
|
-
|
248
|
-
|
249
|
-
|
238
|
+
rails_context_content = content_tag(:div,
|
239
|
+
"",
|
240
|
+
id: "js-react-on-rails-context",
|
241
|
+
style: ReactOnRails.configuration.skip_display_none ? nil : "display:none",
|
242
|
+
data: data)
|
250
243
|
"#{rails_context_content}\n#{render_value}".html_safe
|
251
244
|
end
|
252
245
|
|
253
246
|
def render_redux_store_data(redux_store_data)
|
254
|
-
result = content_tag(:
|
255
|
-
"
|
256
|
-
|
257
|
-
|
258
|
-
|
247
|
+
result = content_tag(:div,
|
248
|
+
"",
|
249
|
+
class: "js-react-on-rails-store",
|
250
|
+
style: ReactOnRails.configuration.skip_display_none ? nil : "display:none",
|
251
|
+
data: redux_store_data)
|
259
252
|
prepend_render_rails_context(result)
|
260
253
|
end
|
261
254
|
|
@@ -24,7 +24,7 @@ Rake::Task["assets:precompile"]
|
|
24
24
|
```
|
25
25
|
|
26
26
|
## Caching Node Modules
|
27
|
-
By default Heroku will cache the root `node_modules` directory between deploys but since we're installing in `client/node_modules` you'll need to add the following line to the `package.json` in your root directory (otherwise you'll have to sit through a full `
|
27
|
+
By default Heroku will cache the root `node_modules` directory between deploys but since we're installing in `client/node_modules` you'll need to add the following line to the `package.json` in your root directory (otherwise you'll have to sit through a full `yarn` on each deploy):
|
28
28
|
|
29
29
|
```js
|
30
30
|
"cacheDirectories": [
|
@@ -87,10 +87,10 @@ Rails.application.config.assets.precompile +=
|
|
87
87
|
rails: REACT_ON_RAILS_ENV= rails s -b 0.0.0.0
|
88
88
|
|
89
89
|
# Build client assets, watching for changes.
|
90
|
-
rails-client-assets:
|
90
|
+
rails-client-assets: yarn run build:dev:client
|
91
91
|
|
92
92
|
# Build server assets, watching for changes. Remove if not server rendering.
|
93
|
-
rails-server-assets:
|
93
|
+
rails-server-assets: yarn run build:dev:server
|
94
94
|
```
|
95
95
|
|
96
96
|
### Procfile.hot
|
@@ -103,9 +103,9 @@ Rails.application.config.assets.precompile +=
|
|
103
103
|
rails: REACT_ON_RAILS_ENV=HOT rails s -b 0.0.0.0
|
104
104
|
|
105
105
|
# Run the hot reload server for client development
|
106
|
-
hot-assets: HOT_RAILS_PORT=3500
|
106
|
+
hot-assets: HOT_RAILS_PORT=3500 yarn run hot-assets
|
107
107
|
|
108
108
|
# Keep the JS fresh for server rendering. Remove if not server rendering
|
109
|
-
rails-server-assets:
|
109
|
+
rails-server-assets: yarn run build:dev:server
|
110
110
|
```
|
111
111
|
|
@@ -1,29 +1,19 @@
|
|
1
|
-
# Node Dependencies and
|
1
|
+
# Node Dependencies, NPM, and Yarn
|
2
|
+
|
2
3
|
## Updating
|
3
|
-
After installing the files, you may want to update the node dependencies. This is analogous to updating gem versions:
|
4
4
|
|
5
|
-
|
6
|
-
cd client
|
7
|
-
npm install -g npm-check-updates
|
8
|
-
rm npm-shrinkwrap.json
|
9
|
-
npm-check-updates -u
|
10
|
-
npm install
|
11
|
-
npm prune
|
12
|
-
npm shrinkwrap
|
13
|
-
```
|
5
|
+
You can check for outdated versions of packages with `yarn outdated` in your `client` directory.
|
14
6
|
|
15
|
-
|
7
|
+
To upgrade package version, use `yarn upgrade [package]`. To update all dependencies, use `yarn upgrade`.
|
16
8
|
|
17
|
-
|
9
|
+
Confirm that the hot replacement dev server and the Rails server both work.
|
18
10
|
|
19
11
|
## Adding New Dependencies
|
20
|
-
Typically, you can add your Node dependencies as you normally would.
|
12
|
+
Typically, you can add your Node dependencies as you normally would.
|
21
13
|
|
22
14
|
```bash
|
23
15
|
cd client
|
24
|
-
|
16
|
+
yarn add module_name@version
|
25
17
|
# or
|
26
|
-
#
|
27
|
-
rm npm-shrinkwrap.json
|
28
|
-
npm shrinkwrap
|
18
|
+
# yarn add --dev module_name@version
|
29
19
|
```
|