@@ -45,10 +45,13 @@ the browser.
4545## Build JS/CSS bundles
4646Run this command to have webpack build the JS/CSS bundles and have them saved in the Rails
4747asset pipeline (app/assets).
48- The Webpack ExtractTextPlugin can optionally be used to extract the CSS out of
49- the JS bundle. The following bundles would then be generated:
50- - rails-bundle.js which gets saved to app/assets/javascripts
48+ Although not shown in this tutorial, the Webpack ExtractTextPlugin can optionally be used
49+ to extract the CSS out of the JS bundle.
50+
51+ The following bundles are generated:
52+ - webpack-bundle.js which gets saved to app/assets/javascripts
5153- bootstrap-and-customizations.css which gets saved in app/assets/stylesheets
54+
5255Observe how the bundles are automatically re-generated whenever your JSX changes.
5356
5457```
@@ -59,14 +62,16 @@ webpack -w --config webpack.rails.config.js
5962Make sure to invoke your local copy of the webpack executable as opposed
6063to any globally installed webpack.
6164See https://github.com/webpack/extract-text-webpack-plugin/blob/master/example/webpack.config.js
62- If in doubt, run the following command:
65+
66+ If in doubt, run the following command, which ensures that your local webpack copy
67+ gets picked:
6368```
6469$(npm bin)/webpack -w --config webpack.rails.config.js
6570```
6671
6772## Run Rails server
6873
69- Once the JS/CSS bundled have been generated into the Rails asset pipeline, you can start
74+ Once the JS/CSS bundles have been generated into the Rails asset pipeline, you can start
7075the Rails server.
7176
7277```
@@ -75,14 +80,16 @@ bundle install
7580rake db:setup
7681rails s -p 4000
7782```
78- Point your browser to [ http://0.0.0.0:4000 ] ( ) .
7983
80- It's important to run the Rails server on a different port than the node server.
84+ Now point your browser to [ http://0.0.0.0:4000 ] ( ) .
85+
86+ Note that it's important to run the Rails server on a different port than the node server.
8187
8288# Webpack configuration
83- - ` webpack.hot.config.js ` : Used by server.js to run the demo express server.
89+ - ` webpack.hot.config.js ` : Used by server.js to run the demo HMR server.
8490- ` webpack.rails.config.js ` : Used to generate the Rails bundles.
85- - ` webpack.common.config.js ` : Common configuration file to minimize code duplication.
91+ - ` webpack.common.config.js ` : Common configuration file to minimize code duplication
92+ between the HMR and Rails configurations.
8693
8794# Bootstrap integration
8895Notice that Bootstrap Sass is installed as both a gem and an npm package.
0 commit comments