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 CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA1:
3
- metadata.gz: 6f878ca896e862aa466d1540b5fcfd5022be4ccd
4
- data.tar.gz: 8551fa8ce69cd3932c0455c0d641909568757836
3
+ metadata.gz: 63e178eebc2e552a818df58260aef2263702dd54
4
+ data.tar.gz: 26f8035429f64a68b8a08f86604e1ab35368c8f7
5
5
  SHA512:
6
- metadata.gz: 322dfa95c38dcde4748993bb3eb9d210d23bbb2e427aef6a61f8e79395d90712ee27bad5d3ee55312448bf5e0c837990a90f0bccaf60961ca24325b83eebc3f5
7
- data.tar.gz: 7d5fe019fe33b004562021b1a0ec880dc46aa81fb1fec611b7220acbb086a4e09730b10e4e955050f6e3f2b241527e839b8b5064fcd0864e1db7aedd6face72f
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 `client/application.js` and write some code
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 `<head>` section of your to your `layout.html.erb`:
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
- * Drive config via JSON, have webpack.config.js read same JSON?
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,10 @@
1
+ import React from 'react';
2
+
3
+ const App = () => (
4
+ <div>
5
+ Hello World
6
+ </div>
7
+ )
8
+
9
+ export default App;
10
+
@@ -0,0 +1,9 @@
1
+ import React from 'react';
2
+ import ReactDOM from 'react-dom';
3
+ import App from './containers/App';
4
+
5
+ ReactDOM.render(
6
+ <App />,
7
+ document.getElementById('app')
8
+ );
9
+
@@ -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,8 @@
1
+ import { combineReducers } from 'redux';
2
+
3
+ const rootReducer = combineReducers({
4
+ //Add reducers here
5
+ });
6
+
7
+ export default rootReducer;
8
+
@@ -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,11 @@
1
+ import React from 'react';
2
+
3
+ const App = ({ children }) => (
4
+ <div>
5
+ Hello World
6
+ { children }
7
+ </div>
8
+ )
9
+
10
+ export default App;
11
+
@@ -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,7 @@
1
+ import { combineReducers } from 'redux';
2
+ import { routerReducer } from 'react-router-redux';
3
+
4
+ const rootReducer = combineReducers({ routing: routerReducer });
5
+
6
+ export default rootReducer;
7
+
@@ -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
+
@@ -0,0 +1,10 @@
1
+ import React from 'react';
2
+ import { Route } from 'react-router';
3
+ import App from './containers/App';
4
+
5
+ export default (
6
+ <Route>
7
+ <Route path="/" component={App} />
8
+ </Route>
9
+ )
10
+
@@ -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
- create_file "webpack/application.js" do
27
- <<-EOF.strip_heredoc
28
- import React from 'react';
29
- import ReactDOM from 'react-dom';
30
- import App from './App';
31
-
32
- ReactDOM.render(
33
- <App />,
34
- document.getElementById('app')
35
- )
36
- EOF
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
- create_file "webpack/App.js" do
40
- <<-EOF.strip_heredoc
41
- import React from 'react';
42
-
43
- class App extends React.Component {
44
- render() {
45
- return(
46
- <div>
47
- Hello World
48
- </div>
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 the 'application' entry point in to your layout, and
83
- e.g. <%= javascript_include_tag *webpack_asset_paths('application') %>
84
- 2. Add an element with an id of 'app' to your layout
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
@@ -2,7 +2,7 @@ module Webpack
2
2
  # :nodoc:
3
3
  module Rails
4
4
  module React
5
- VERSION = "1.0.1"
5
+ VERSION = "1.0.2"
6
6
  end
7
7
  end
8
8
  end
@@ -30,4 +30,4 @@ module Webpack
30
30
  load "tasks/webpack.rake"
31
31
  end
32
32
  end
33
- end
33
+ end
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.1
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-07 00:00:00.000000000 Z
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
- - djungst@gmail.com
32
- - jakesorce@gmail.com
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/jakesorce/webpack-rails-react
63
+ homepage: https://github.com/cottonwoodcoding/webpack-rails-react
53
64
  licenses:
54
65
  - MIT
55
66
  metadata: {}