webpack-rails-react 1.0.1 → 1.0.2
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/README.md +6 -6
- data/example/boilerplate/App.js +10 -0
- data/example/boilerplate/application.js +9 -0
- data/example/boilerplate/redux/application.js +13 -0
- data/example/boilerplate/redux/reducers.js +8 -0
- data/example/boilerplate/redux/store.js +23 -0
- data/example/boilerplate/router/App.js +11 -0
- data/example/boilerplate/router/application.js +10 -0
- data/example/boilerplate/router_redux/application.js +14 -0
- data/example/boilerplate/router_redux/reducers.js +7 -0
- data/example/boilerplate/router_redux/store.js +18 -0
- data/example/boilerplate/routes.js +10 -0
- data/lib/generators/webpack_rails_react/install_generator.rb +64 -51
- data/lib/webpack/rails/react/version.rb +1 -1
- data/lib/webpack/railtie.rb +1 -1
- metadata +16 -5
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA1:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: 63e178eebc2e552a818df58260aef2263702dd54
|
4
|
+
data.tar.gz: 26f8035429f64a68b8a08f86604e1ab35368c8f7
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: a2c2c5a5d70595c4d9895ca21f1c5ac7096ef40a45b39204a1a001b996bce4563a4b2615a7ea6ab60e6476706a63ee4ad21c9b32980ab63ae841590ae0574605
|
7
|
+
data.tar.gz: b7ff9db65edd39606afa1b5c3f11dcd1677671e46f4111c8292212d325d6c1888941844288f06c46b140eba42ff32f00ddbc104aa13e518b43eedd1568813fb3
|
data/README.md
CHANGED
@@ -19,12 +19,12 @@ This gem has been tested against Rails 4.2 and Ruby 2.2. Earlier versions of Rai
|
|
19
19
|
1. Run `bundle exec rails generate webpack_rails_react:install` to copy across example files
|
20
20
|
1. Run `foreman start` to start `webpack-dev-server` and `rails server` at the same time
|
21
21
|
1. Add the webpack entry point to your layout (see next section)
|
22
|
-
1. Edit `
|
22
|
+
1. Edit `webpack/application.js` and write some code
|
23
23
|
|
24
24
|
|
25
25
|
### Adding the entry point to your Rails application
|
26
26
|
|
27
|
-
To add your webpacked javascript in to your app, add the following to the `<
|
27
|
+
To add your webpacked javascript in to your app, add the following to the `<body>` section of any layout by default it has been added to `layout.html.erb`:
|
28
28
|
|
29
29
|
```erb
|
30
30
|
<%= javascript_include_tag *webpack_asset_paths("application") %>
|
@@ -40,6 +40,8 @@ If you're using the webpack dev server's live reload feature (not the React hot
|
|
40
40
|
<script src="http://localhost:3808/webpack-dev-server.js"></script>
|
41
41
|
```
|
42
42
|
|
43
|
+
This has been added to layouts/index.html.erb by default.
|
44
|
+
|
43
45
|
### Configuration Defaults
|
44
46
|
|
45
47
|
* Webpack configuration lives in `config/webpack.config.js`
|
@@ -69,9 +71,7 @@ If you're using `[chunkhash]` in your build asset filenames (which you should be
|
|
69
71
|
|
70
72
|
## TODO
|
71
73
|
|
72
|
-
*
|
73
|
-
* Custom webpack-dev-server that exposes errors, stats, etc
|
74
|
-
* [react-rails](https://github.com/reactjs/react-rails) fork for use with this workflow
|
74
|
+
* Add eslint to client
|
75
75
|
* Integration tests
|
76
76
|
|
77
77
|
## Contributing
|
@@ -82,4 +82,4 @@ Please ensure that pull requests pass both rubocop & rspec. New functionality sh
|
|
82
82
|
|
83
83
|
## Acknowledgements
|
84
84
|
|
85
|
-
* mipearson for his [webpack-rails](https://github.com/mipearson/webpack-rails) gem which inspired this implementation
|
85
|
+
* mipearson for his [webpack-rails](https://github.com/mipearson/webpack-rails) gem which inspired this implementation
|
@@ -0,0 +1,13 @@
|
|
1
|
+
import React from 'react';
|
2
|
+
import ReactDOM from 'react-dom';
|
3
|
+
import store from './store';
|
4
|
+
import { Provider } from 'react-redux';
|
5
|
+
import App from './containers/App';
|
6
|
+
|
7
|
+
ReactDOM.render(
|
8
|
+
<Provider store={store}>
|
9
|
+
<App />
|
10
|
+
</Provider>,
|
11
|
+
document.getElementById('app')
|
12
|
+
);
|
13
|
+
|
@@ -0,0 +1,23 @@
|
|
1
|
+
import { createStore, compose, applyMiddleware } from 'redux';
|
2
|
+
import thunk from 'redux-thunk';
|
3
|
+
|
4
|
+
// import the root reducer
|
5
|
+
import rootReducer from './reducers/index';
|
6
|
+
|
7
|
+
const createStoreWithMiddleware = compose (
|
8
|
+
applyMiddleware(thunk),
|
9
|
+
window.devToolsExtension ? window.devToolsExtension() : f => f
|
10
|
+
)(createStore)
|
11
|
+
|
12
|
+
const store = createStoreWithMiddleware(rootReducer);
|
13
|
+
|
14
|
+
|
15
|
+
if(module.hot) {
|
16
|
+
module.hot.accept('./reducers/',() => {
|
17
|
+
const nextRootReducer = require('./reducers/index').default;
|
18
|
+
store.replaceReducer(nextRootReducer);
|
19
|
+
});
|
20
|
+
}
|
21
|
+
|
22
|
+
export default store;
|
23
|
+
|
@@ -0,0 +1,10 @@
|
|
1
|
+
import React from 'react';
|
2
|
+
import ReactDOM from 'react-dom';
|
3
|
+
import { Router, browserHistory } from 'react-router';
|
4
|
+
import routes from './routes';
|
5
|
+
|
6
|
+
ReactDOM.render(
|
7
|
+
<Router history={broserHistory} routes={routes} />,
|
8
|
+
doucment.getElementById('app')
|
9
|
+
);
|
10
|
+
|
@@ -0,0 +1,14 @@
|
|
1
|
+
import React from 'react';
|
2
|
+
import ReactDOM from 'react-dom';
|
3
|
+
import { Router } from 'react-router';
|
4
|
+
import routes from './routes';
|
5
|
+
import { Provider } from 'react-redux';
|
6
|
+
import store, { history } from './store';
|
7
|
+
|
8
|
+
ReactDOM.render(
|
9
|
+
<Provider store={store}>
|
10
|
+
<Router history={history} routes={routes} />
|
11
|
+
</Provider>,
|
12
|
+
document.getElementById('app')
|
13
|
+
);
|
14
|
+
|
@@ -0,0 +1,18 @@
|
|
1
|
+
import { createStore, compose, applyMiddleware } from 'redux';
|
2
|
+
import { syncHistoryWithStore } from 'react-router-redux';
|
3
|
+
import { browserHistory } from 'react-router';
|
4
|
+
import thunk from 'redux-thunk';
|
5
|
+
|
6
|
+
import rootReducer from './reducers/index';
|
7
|
+
|
8
|
+
const enhancers = compose(
|
9
|
+
applyMiddleware(thunk),
|
10
|
+
window.devToolsExtension ? window.devToolsExtension() : f => f
|
11
|
+
)
|
12
|
+
|
13
|
+
const store = createStore(rootReducer, {}, enhancers)
|
14
|
+
|
15
|
+
export const history = syncHistoryWithStore(browserHistory, store)
|
16
|
+
|
17
|
+
export default store
|
18
|
+
|
@@ -4,6 +4,8 @@ module WebpackRailsReact
|
|
4
4
|
source_root File.expand_path("../../../../example", __FILE__)
|
5
5
|
|
6
6
|
desc "Install everything you need for a basic webpack-rails integration"
|
7
|
+
class_option :router, type: :boolean, default: false, description: 'Add React Router'
|
8
|
+
class_option :redux, type: :boolean, default: false, description: 'Add Redux'
|
7
9
|
|
8
10
|
def add_foreman_to_gemfile
|
9
11
|
gem 'foreman'
|
@@ -15,6 +17,32 @@ module WebpackRailsReact
|
|
15
17
|
|
16
18
|
def copy_package_json
|
17
19
|
copy_file "package.json", "package.json"
|
20
|
+
|
21
|
+
if options[:router]
|
22
|
+
insert_into_file './package.json', after: /dependencies\": {\n/ do
|
23
|
+
<<-'RUBY'
|
24
|
+
"react-router": "^2.4.1",
|
25
|
+
RUBY
|
26
|
+
end
|
27
|
+
end
|
28
|
+
|
29
|
+
if options[:redux]
|
30
|
+
insert_into_file './package.json', after: /dependencies\": {\n/ do
|
31
|
+
<<-'RUBY'
|
32
|
+
"react-redux": "^4.4.5",
|
33
|
+
"redux": "^3.5.2",
|
34
|
+
"redux-thunk": "^2.1.0",
|
35
|
+
RUBY
|
36
|
+
end
|
37
|
+
end
|
38
|
+
|
39
|
+
if options[:router] && options[:redux]
|
40
|
+
insert_into_file './package.json', after: /dependencies\": {\n/ do
|
41
|
+
<<-'RUBY'
|
42
|
+
"react-router-redux": "^4.0.5",
|
43
|
+
RUBY
|
44
|
+
end
|
45
|
+
end
|
18
46
|
end
|
19
47
|
|
20
48
|
def copy_webpack_conf
|
@@ -23,35 +51,40 @@ module WebpackRailsReact
|
|
23
51
|
|
24
52
|
def create_webpack_application_js
|
25
53
|
empty_directory "webpack"
|
26
|
-
|
27
|
-
|
28
|
-
|
29
|
-
|
30
|
-
|
31
|
-
|
32
|
-
|
33
|
-
|
34
|
-
|
35
|
-
|
36
|
-
|
54
|
+
|
55
|
+
if options[:router] && options[:redux]
|
56
|
+
copy_file "boilerplate/router_redux/application.js", "webpack/application.js"
|
57
|
+
copy_file "boilerplate/routes.js", "webpack/routes.js"
|
58
|
+
copy_file "boilerplate/router_redux/store.js", "webpack/store.js"
|
59
|
+
copy_file "boilerplate/router_redux/reducers.js", "webpack/reducers/index.js"
|
60
|
+
create_file "webpack/actions.js"
|
61
|
+
copy_file "boilerplate/router/App.js", "webpack/containers/App.js"
|
62
|
+
elsif options[:router]
|
63
|
+
copy_file "boilerplate/router/application.js", "webpack/application.js"
|
64
|
+
copy_file "boilerplate/routes.js", "webpack/routes.js"
|
65
|
+
copy_file "boilerplate/router/App.js", "webpack/containers/App.js"
|
66
|
+
elsif options[:redux]
|
67
|
+
copy_file "boilerplate/redux/application.js", "webpack/application.js"
|
68
|
+
copy_file "boilerplate/redux/store.js", "webpack/store.js"
|
69
|
+
copy_file "boilerplate/redux/reducers.js", "webpack/reducers/index.js"
|
70
|
+
create_file "webpack/actions.js"
|
71
|
+
copy_file "boilerplate/App.js", "webpack/containers/App.js"
|
72
|
+
else
|
73
|
+
copy_file "boilerplate/application.js", "webpack/application.js"
|
74
|
+
copy_file "boilerplate/App.js", "webpack/containers/App.js"
|
37
75
|
end
|
38
76
|
|
39
|
-
|
40
|
-
|
41
|
-
|
42
|
-
|
43
|
-
|
44
|
-
|
45
|
-
|
46
|
-
|
47
|
-
|
48
|
-
|
49
|
-
|
50
|
-
}
|
51
|
-
}
|
52
|
-
|
53
|
-
export default App;
|
54
|
-
EOF
|
77
|
+
empty_directory "webpack/components"
|
78
|
+
|
79
|
+
insert_into_file 'app/views/layouts/application.html.erb', before: /<\/body>/ do
|
80
|
+
<<-'RUBY'
|
81
|
+
<%= javascript_include_tag *webpack_asset_paths('application') %>
|
82
|
+
RUBY
|
83
|
+
end
|
84
|
+
insert_into_file 'app/views/layouts/application.html.erb', before: /<\/head>/ do
|
85
|
+
<<-'RUBY'
|
86
|
+
<script src="http://localhost:3808/webpack-dev-server.js"></script>
|
87
|
+
RUBY
|
55
88
|
end
|
56
89
|
end
|
57
90
|
|
@@ -76,32 +109,12 @@ module WebpackRailsReact
|
|
76
109
|
def whats_next
|
77
110
|
puts <<-EOF.strip_heredoc
|
78
111
|
|
79
|
-
We've set up the basics of webpack-rails for you, but you'll still
|
112
|
+
We've set up the basics of webpack-rails-react for you, but you'll still
|
80
113
|
need to:
|
81
114
|
|
82
|
-
1. Add
|
83
|
-
|
84
|
-
|
85
|
-
3. Enable hot module replacement by adding <script src="http://localhost:3808/webpack-dev-server.js"></script> to your layout
|
86
|
-
4. Run 'foreman start' to run the webpack-dev-server and rails server
|
87
|
-
|
88
|
-
Example app/views/layouts/application.html.erb
|
89
|
-
<!DOCTYPE html>
|
90
|
-
<html>
|
91
|
-
<head>
|
92
|
-
<title>WebpackDemo</title>
|
93
|
-
<%= stylesheet_link_tag 'application', media: 'all' %>
|
94
|
-
<%= javascript_include_tag 'application' %>
|
95
|
-
<script src="http://localhost:3808/webpack-dev-server.js"></script>
|
96
|
-
<%= csrf_meta_tags %>
|
97
|
-
</head>
|
98
|
-
<body>
|
99
|
-
|
100
|
-
<%= yield %>
|
101
|
-
<%= javascript_include_tag *webpack_asset_paths('application') %>
|
102
|
-
</body>
|
103
|
-
</html>
|
104
|
-
|
115
|
+
1. Add an element with an id of 'app' to your layout
|
116
|
+
2. To disable hot module replacement remove <script src="http://localhost:3808/webpack-dev-server.js"></script> from layout
|
117
|
+
3. Run 'foreman start' to run the webpack-dev-server and rails server
|
105
118
|
|
106
119
|
See the README.md for this gem at
|
107
120
|
https://github.com/wdjungst/webpack-rails-react/blob/master/README.md
|
data/lib/webpack/railtie.rb
CHANGED
metadata
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: webpack-rails-react
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 1.0.
|
4
|
+
version: 1.0.2
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- Dave Jungst
|
@@ -9,7 +9,7 @@ authors:
|
|
9
9
|
autorequire:
|
10
10
|
bindir: bin
|
11
11
|
cert_chain: []
|
12
|
-
date: 2016-06-
|
12
|
+
date: 2016-06-09 00:00:00.000000000 Z
|
13
13
|
dependencies:
|
14
14
|
- !ruby/object:Gem::Dependency
|
15
15
|
name: rails
|
@@ -28,8 +28,8 @@ dependencies:
|
|
28
28
|
description: Production-tested, JavaScript-first tooling to use webpack within your
|
29
29
|
Rails application
|
30
30
|
email:
|
31
|
-
-
|
32
|
-
-
|
31
|
+
- dave@cottonwoodcoding.com
|
32
|
+
- jake@cottonwoodcoding.com
|
33
33
|
executables: []
|
34
34
|
extensions: []
|
35
35
|
extra_rdoc_files: []
|
@@ -38,6 +38,17 @@ files:
|
|
38
38
|
- README.md
|
39
39
|
- Rakefile
|
40
40
|
- example/Procfile
|
41
|
+
- example/boilerplate/App.js
|
42
|
+
- example/boilerplate/application.js
|
43
|
+
- example/boilerplate/redux/application.js
|
44
|
+
- example/boilerplate/redux/reducers.js
|
45
|
+
- example/boilerplate/redux/store.js
|
46
|
+
- example/boilerplate/router/App.js
|
47
|
+
- example/boilerplate/router/application.js
|
48
|
+
- example/boilerplate/router_redux/application.js
|
49
|
+
- example/boilerplate/router_redux/reducers.js
|
50
|
+
- example/boilerplate/router_redux/store.js
|
51
|
+
- example/boilerplate/routes.js
|
41
52
|
- example/dot_gitignore
|
42
53
|
- example/package.json
|
43
54
|
- example/webpack.config.js
|
@@ -49,7 +60,7 @@ files:
|
|
49
60
|
- lib/webpack/rails/react/manifest.rb
|
50
61
|
- lib/webpack/rails/react/version.rb
|
51
62
|
- lib/webpack/railtie.rb
|
52
|
-
homepage: https://github.com/
|
63
|
+
homepage: https://github.com/cottonwoodcoding/webpack-rails-react
|
53
64
|
licenses:
|
54
65
|
- MIT
|
55
66
|
metadata: {}
|