From d45ca7a11620bab22f886a9039b502aa65ff2df9 Mon Sep 17 00:00:00 2001 From: Justin Gordon Date: Mon, 29 May 2017 23:19:05 -1000 Subject: [PATCH] 8.0.0 updates * Remove unnecessary configuration of assets.rb * Doc updates --- CHANGELOG.md | 24 ++++++++++++------- README.md | 21 ++++++++-------- .../hot-reloading-rails-development.md | 1 - docs/api/ruby-api-hot-reload-view-helpers.md | 2 ++ docs/basics/installation-overview.md | 1 - docs/tutorial.md | 2 +- .../react_on_rails/base_generator.rb | 24 ------------------- .../assets/javascripts/application_static.js | 22 ----------------- .../stylesheets/application_static.css.scss | 12 ---------- spec/dummy/config/initializers/assets.rb | 14 ----------- .../generators/install_generator_spec.rb | 11 --------- .../support/generator_spec_helper.rb | 22 ----------------- .../base_generator_examples.rb | 5 ---- 13 files changed, 28 insertions(+), 133 deletions(-) delete mode 100644 spec/dummy/app/assets/javascripts/application_static.js delete mode 100644 spec/dummy/app/assets/stylesheets/application_static.css.scss diff --git a/CHANGELOG.md b/CHANGELOG.md index f370d00da..e02c739aa 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -8,11 +8,21 @@ Changes since last non-beta release. *Please add entries here for your pull requests.* -## [8.0.0-unreleased] -- All 8.0.0 changes since last beta. +## [8.0.1] +### Fixed +- Generator no longer modifies `assets.rb`. [#859](https://github.com/shakacode/react_on_rails/pull/859) by [justin808](https://github.com/justin808) + +## [8.0.0] +- Generators and full support for [webpacker_lite](https://github.com/shakacode/webpacker_lite) +- No breaking changes to move to 8.0.0 other than the default for this setting changed to nil. If you depended on the default of this setting and are using the asset pipeline (and not webpacker_lite), then add this to your `config/initializers/react_on_rails.rb`: + ``` + symlink_non_digested_assets_regex: /\.(png|jpg|jpeg|gif|tiff|woff|ttf|eot|svg|map)/, + ``` +- For an example of migration, see: [react-webpack-rails-tutorial PR #395](https://github.com/shakacode/react-webpack-rails-tutorial/pull/395) +- For a simple example of the webpacker_lite setup, run the basic generator. ## [8.0.0-beta.3] - 2017-05-27 -## Changed +### Changed - Major updates for WebpackerLite 2.0.2. [#844](https://github.com/shakacode/react_on_rails/pull/845) by [justin808](https://github.com/justin808) with help from ](https://github.com/robwise) - Logging no longer occurs when trace is turned to false. [#845](https://github.com/shakacode/react_on_rails/pull/845) by [conturbo](https://github.com/Conturbo) @@ -26,9 +36,6 @@ Removed unnecessary values in default paths.yml files for generators. [#834](htt ### Added Support for WebpackerLite in the generators. [#822](https://github.com/shakacode/react_on_rails/pull/822) by [kaizencodes](https://github.com/kaizencodes) and [justin808](https://github.com/justin808). -1. You do not need to switch to WebpackerLite to use 8.0.0. -2. You can find an upgrade example in [react-webpack-rails-tutorial PR #387](https://github.com/shakacode/react-webpack-rails-tutorial/pull/387). - ### Changed Breaking change is that the default value of symlink_non_digested_assets_regex has changed from this old value to nil. This is a breaking change if you didn't have this value set in your @@ -39,7 +46,6 @@ features and you have not switched to webpacker lite. symlink_non_digested_assets_regex: /\.(png|jpg|jpeg|gif|tiff|woff|ttf|eot|svg|map)/, ``` - ## [7.0.4] - 2017-04-27 - Return empty json when nil in json_safe_and_pretty [#824](https://github.com/shakacode/react_on_rails/pull/824) by [dzirtusss](https://github.com/dzirtusss) @@ -590,8 +596,8 @@ Best done with Object destructing: ##### Fixed - Fix several generator related issues. -[Unreleased]: https://github.com/shakacode/react_on_rails/compare/7.0.4...master -[8.0.0-unreleased]: https://github.com/shakacode/react_on_rails/compare/8.0.0-beta.3...master +[Unreleased]: https://github.com/shakacode/react_on_rails/compare/8.0.0...master +[8.0.0]: https://github.com/shakacode/react_on_rails/compare/7.0.4...8.0.0 [8.0.0-beta.3]: https://github.com/shakacode/react_on_rails/compare/8.0.0-beta.2...8.0.0-beta.3 [8.0.0-beta.2]: https://github.com/shakacode/react_on_rails/compare/8.0.0-beta.1...8.0.0-beta.2 [8.0.0-beta.1]: https://github.com/shakacode/react_on_rails/compare/7.0.4...8.0.0-beta.1 diff --git a/README.md b/README.md index bdc555066..fe23c6bac 100644 --- a/README.md +++ b/README.md @@ -1,9 +1,10 @@ [![Build Status](https://travis-ci.org/shakacode/react_on_rails.svg?branch=master)](https://travis-ci.org/shakacode/react_on_rails) [![Codeship Status for shakacode/react_on_rails](https://app.codeship.com/projects/cec6c040-971f-0134-488f-0a5146246bd8/status?branch=master)](https://app.codeship.com/projects/187011) [![Dependency Status](https://gemnasium.com/shakacode/react_on_rails.svg)](https://gemnasium.com/shakacode/react_on_rails) [![Gem Version](https://badge.fury.io/rb/react_on_rails.svg)](https://badge.fury.io/rb/react_on_rails) [![npm version](https://badge.fury.io/js/react-on-rails.svg)](https://badge.fury.io/js/react-on-rails) [![Code Climate](https://codeclimate.com/github/shakacode/react_on_rails/badges/gpa.svg)](https://codeclimate.com/github/shakacode/react_on_rails) [![Coverage Status](https://coveralls.io/repos/shakacode/react_on_rails/badge.svg?branch=master&service=github)](https://coveralls.io/github/shakacode/react_on_rails?branch=master) -#### The Docs here on `master` refer to 8.0.0-beta.3 including support for Webpacker! 7.0.4 docs are [here](https://github.com/shakacode/react_on_rails/tree/7.0.4). -**VERSION 8 is super close!!!** +The Docs here on `master` refer to 8.0.0 including support for webpacker_lite! -**[VERSION 8.0.0-beta.3](https://rubygems.org/gems/react_on_rails/versions/8.0.0.beta.3)** has shipped with [webpacker_lite](https://github.com/shakacode/webpacker_lite) support! Please try [the 8.0.0-beta.3 beta](https://rubygems.org/gems/react_on_rails/versions/8.0.0.beta.3) and please report issues! We're **SUPER** close as we've also upgraded the [shakacode/react-webpack-rails-tutorial](https://github.com/shakacode/react-webpack-rails-tutorial) with [PR #395](https://github.com/shakacode/react-webpack-rails-tutorial/pull/395). That PR shows the changes needed to go to Webpacker Lite. +[7.0.4 docs](https://github.com/shakacode/react_on_rails/tree/7.0.4). + +**[VERSION 8.0.0](https://rubygems.org/gems/react_on_rails/versions/8.0.0.beta.3)** has shipped with [webpacker_lite](https://github.com/shakacode/webpacker_lite) support! [react-webpack-rails-tutorial PR #395](https://github.com/shakacode/react-webpack-rails-tutorial/pull/395) shows the changes needed to go to Webpacker Lite. * Why did we fork webpacker to make webpacker_lite? Please provide feedback on my draft article: [Webpacker Lite: Why Did We Fork Webpacker?](https://medium.com/@railsonmaui/webpacker-lite-why-did-we-fork-webpacker-ee3305688d66) (Draft will soon become regular article). **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))** @@ -63,7 +64,7 @@ For more testimonials, see [Live Projects](PROJECTS.md) and [Kudos](./KUDOS.md). **Project Objective**: To provide an opinionated and optimal framework for integrating Ruby on Rails with modern JavaScript tooling and libraries, including [**Webpack**](http://webpack.github.io/), [**Babel**](https://babeljs.io/), [**React**](https://facebook.github.io/react/), [**Redux**](https://github.com/reactjs/redux), [**React-Router**](https://github.com/reactjs/react-router). This differs significantly from typical Rails architecture. When considering what goes into **react_on_rails**, we ask ourselves, is the functionality related to the intersection of using Rails and modern JavaScript? If so, then the functionality belongs right here. In other cases, we're releasing separate npm packages or Ruby gems. If you are interested in implementing React using traditional Rails architecture, see [react-rails](https://github.com/reactjs/react-rails). -React on Rails integrates Facebook's [React](https://github.com/facebook/react) front-end framework with Rails. React v0.14.x and greater is supported, with server rendering. [Redux](https://github.com/reactjs/redux) and [React-Router](https://github.com/reactjs/react-redux) are supported as well, also with server rendering, using either **execJS** or a [Node.js server](https://github.com/shakacode/react_on_rails/blob/master/docs%2Fadditional-reading%2Fnode-server-rendering.md). See the Rails on Maui [blog post](http://www.railsonmaui.com/blog/2014/10/03/integrating-webpack-and-the-es6-transpiler-into-an-existing-rails-project/) that started it all! +React on Rails integrates Facebook's [React](https://github.com/facebook/react) front-end framework with Rails. React v0.14.x and greater is supported, with server rendering. [Redux](https://github.com/reactjs/redux) and [React-Router](https://github.com/reactjs/react-redux) are supported as well, also with server rendering, using **execJS**. See the Rails on Maui [blog post](http://www.railsonmaui.com/blog/2014/10/03/integrating-webpack-and-the-es6-transpiler-into-an-existing-rails-project/) that started it all! ## Table of Contents @@ -103,27 +104,25 @@ See the [react-webpack-rails-tutorial](https://github.com/shakacode/react-webpac ## Why Webpack? -Webpack is used to generate several JavaScript "bundles" for inclusion in `application.js` or directly in your layout. +Webpack is used to generate JavaScript and CSS "bundles" directly to your `/public` directory. [webpacker_lite](https://github.com/shakacode/webpacker_lite) provides view helpers to access the Webpack generated (and fingerprinted) JS and CSS. These files totally skip the Rails asset pipeline. You are responsible for properly processing your Webpack output via the Webpack config files. -This usage of webpack fits neatly and simply into the existing Rails sprockets system and you can include React components on a Rails view with a simple helper. +This usage of webpack fits neatly and simply into existing Rails apps. You can include React components on a Rails view with a simple helper. Compare this to some alternative approaches for SPAs (Single Page Apps) that utilize Webpack and Rails. They will use a separate node server to distribute web pages, JavaScript assets, CSS, etc., and will still use Rails as an API server. A good example of this is our ShakaCode team member Alex's article [ Universal React with Rails: Part I](https://medium.com/@alexfedoseev/isomorphic-react-with-rails-part-i-440754e82a59). -We're definitely not doing that. With react_on_rails, webpack is mainly generating a nice JavaScript file for inclusion into `application.js`. We're going to KISS. And that's all relative given how much there is to get right in an enterprise class web application. - ## Upgrade -To upgrade existing apps to react on rails 7 see the [Installation Overview](docs/basics/installation-overview.md) +To upgrade existing apps to React on Rails 8 see the [Installation Overview](docs/basics/installation-overview.md) ## Getting Started **For more detailed instructions**, see the [React on Rails Basic Tutorial](docs/tutorial.md). -1. Add the following to your Gemfile and `bundle install`. +1. Add the following to your Gemfile and `bundle install`. We recommend fixing the version of React on Rails, as you will need to keep the exact version in sync with the version in your `client/package.json` file. ```ruby - gem "react_on_rails", "~> 7" + gem "react_on_rails", "8.0.0" ``` 2. Commit this to git (you cannot run the generator unless you do this or pass the option `--ignore-warnings`). diff --git a/docs/additional-reading/hot-reloading-rails-development.md b/docs/additional-reading/hot-reloading-rails-development.md index e893f6405..75e7c67c4 100644 --- a/docs/additional-reading/hot-reloading-rails-development.md +++ b/docs/additional-reading/hot-reloading-rails-development.md @@ -31,7 +31,6 @@ The secret sauce is in the [app/views/layouts/application.html.erb](https://gith 1. Configure the file Rails asset pipeline files: 1. [app/assets/javascripts/application_static.js](https://github.com/shakacode/react_on_rails/tree/master/spec/dummy/app/assets/javascripts/application_static.js) 1. [app/assets/stylesheets/application_static.css.scss](https://github.com/shakacode/react_on_rails/tree/master/spec/dummy/app/assets/stylesheets/application_static.css.scss) -1. Be sure your [config/initializers/assets.rb](https://github.com/shakacode/react_on_rails/tree/master/spec/dummy/config/initializers/assets.rb) is configured to include the webpack generated files. 1. Copy the [client/server-rails-hot.js](https://github.com/shakacode/react_on_rails/tree/master/spec/dummy/client/server-rails-hot.js) to the your client directory. 1. Copy the scripts in the top level and client level `package.json` files: 1. Top Level: [package.json](https://github.com/shakacode/react_on_rails/tree/master/spec/dummy/package.json) diff --git a/docs/api/ruby-api-hot-reload-view-helpers.md b/docs/api/ruby-api-hot-reload-view-helpers.md index d0c05a1af..3b2f55780 100644 --- a/docs/api/ruby-api-hot-reload-view-helpers.md +++ b/docs/api/ruby-api-hot-reload-view-helpers.md @@ -1,3 +1,5 @@ +## NOTE: These helpers are NOT needed if using webpacker_lite + ## Hot Reloading View Helpers The `env_javascript_include_tag` and `env_stylesheet_link_tag` support the usage of a webpack dev server for providing the JS and CSS assets during development mode. See the [shakacode/react-webpack-rails-tutorial](https://github.com/shakacode/react-webpack-rails-tutorial/) for a working example. diff --git a/docs/basics/installation-overview.md b/docs/basics/installation-overview.md index 5afa09d07..7145a1a57 100644 --- a/docs/basics/installation-overview.md +++ b/docs/basics/installation-overview.md @@ -26,7 +26,6 @@ The default path: `public/webpack` can be loaded with webpackConfigLoader as sho 1. Add `gem "webpacker_lite"` to the Gemfile, run bundle. The gem provides the `stylesheet_pack_tag` and `javascript_pack_tag` helpers which is used to load the bundled assets to your layouts.[Dummy Example](../../spec/dummy/app/views/layouts/application.html.erb) 1. Configure the `config/initializers/react_on_rails.rb`. You can adjust some necessary settings and defaults. See file [spec/dummy/config/initializers/react_on_rails.rb](../../spec/dummy/config/initializers/react_on_rails.rb) for a detailed example of configuration, including comments on the different values to configure. 1. Configure your Procfiles per the example apps. These are at the root of your Rails installation. -1. Configure `config/initializers/assets.rb` probably like [spec/dummy/config/initializers/assets.rb](../../spec/dummy/config/initializers/assets.rb). This example shows what's necessary if you're enabling the hot-reloading Rails development option. 1. Configure your top level JavaScript files for inclusion in your layout. You'll want a version that you use for static assets, and you want a file for any files in your setup that are not part of your webpack build. The reason for this is for use with hot-reloading. If you are not using hot reloading, then you only need to configure your `application.js` file to include your Webpack generated files. For more information on hot reloading, see [Hot Reloading of Assets For Rails Development](../additional-reading/hot-reloading-rails-development.md) 1. Configure your `lib/tasks/assets.rake` file to run webpack during asset precompilation. diff --git a/docs/tutorial.md b/docs/tutorial.md index 086bbc33c..b59cb8c71 100644 --- a/docs/tutorial.md +++ b/docs/tutorial.md @@ -51,7 +51,7 @@ cd test-react-on-rails Add **React On Rails** gem to your Gemfile (`vim Gemfile` or `nano Gemfile` or in IDE): ``` -gem 'react_on_rails', '~>7' # use latest gem version > 7 +gem 'react_on_rails', '8.0.0' # use latest gem version, prefer exact version ``` ![02](https://cloud.githubusercontent.com/assets/20628911/17464919/3c2d74c2-5cf2-11e6-8704-a84958832fbb.png) diff --git a/lib/generators/react_on_rails/base_generator.rb b/lib/generators/react_on_rails/base_generator.rb index 6d79d6f32..b20bc7b5a 100644 --- a/lib/generators/react_on_rails/base_generator.rb +++ b/lib/generators/react_on_rails/base_generator.rb @@ -1,5 +1,3 @@ -# rubocop:disable Metrics/ClassLength - require "rails/generators" require_relative "generator_messages" require_relative "generator_helper" @@ -74,28 +72,6 @@ def add_base_gems_to_gemfile append_to_file("Gemfile", "\ngem 'mini_racer', platforms: :ruby\ngem 'webpacker_lite'\n") end - ASSETS_RB_APPEND = <<-DATA.strip_heredoc -# Add client/assets/ folders to asset pipeline's search path. -# If you do not want to move existing images and fonts from your Rails app -# you could also consider creating symlinks there that point to the original -# rails directories. In that case, you would not add these paths here. -# If you have a different server bundle file than your client bundle, you'll -# need to add it here, like this: -# Rails.application.config.assets.precompile += %w( server-bundle.js ) - -# Add folder with webpack generated assets to assets.paths -Rails.application.config.assets.paths << Rails.root.join("public", "webpack", Rails.env) - DATA - - def append_to_assets_initializer - assets_initializer = File.join(destination_root, "config/initializers/assets.rb") - if File.exist?(assets_initializer) - append_to_file(assets_initializer, ASSETS_RB_APPEND) - else - create_file(assets_initializer, ASSETS_RB_APPEND) - end - end - def append_to_spec_rails_helper rails_helper = File.join(destination_root, "spec/rails_helper.rb") if File.exist?(rails_helper) diff --git a/spec/dummy/app/assets/javascripts/application_static.js b/spec/dummy/app/assets/javascripts/application_static.js deleted file mode 100644 index 33e1ab5cd..000000000 --- a/spec/dummy/app/assets/javascripts/application_static.js +++ /dev/null @@ -1,22 +0,0 @@ -// This file is used in production and tests to serve generated JS assets. -// -// In development mode, we use either: -// Procfile.static: Load static assets -// Procfile.hot: Use the Webpack Dev Server to provide assets. This allows for hot reloading of -// the JS and CSS via HMR. -// -// To understand which one is used, see app/views/layouts/application.html.erb - -// These assets are located in app/assets/webpack directory -// It is CRITICAL for Turbolinks 2.x that webpack/vendor-bundle must be BEFORE turbolinks -// since it is exposing jQuery and jQuery-ujs - -// NOTE: See config/initializers/assets.rb for some critical configuration regarding sprockets. -// Basically, in HOT mode, we do not include this file for -// Rails.application.config.assets.precompile - -//= require vendor-bundle -//= require app-bundle - -// Non-webpack assets include turbolinks and these are loaded in the "hot" mode as well. -//= require application_non_webpack diff --git a/spec/dummy/app/assets/stylesheets/application_static.css.scss b/spec/dummy/app/assets/stylesheets/application_static.css.scss deleted file mode 100644 index 20d91df50..000000000 --- a/spec/dummy/app/assets/stylesheets/application_static.css.scss +++ /dev/null @@ -1,12 +0,0 @@ -// These assets are located in app/assets/webpack directory, and are generated ONLY when static -// assets are prepared (not for hot reloading assets). - -// Super important: This file is loaded even for hot loading only, so we need to be sure -// that we don't reference the static generated CSS files. - -// If we were importing bootstrap, we'd have this generated. -// @import 'vendor-bundle' -@import 'app-bundle'; - -// Non-webpack assets -@import 'application_non_webpack'; diff --git a/spec/dummy/config/initializers/assets.rb b/spec/dummy/config/initializers/assets.rb index c2552cea4..0838adaa2 100644 --- a/spec/dummy/config/initializers/assets.rb +++ b/spec/dummy/config/initializers/assets.rb @@ -9,17 +9,3 @@ # Precompile additional assets. # application.js, application.css, and all non-JS/CSS in app/assets folder are already added. # Rails.application.config.assets.precompile += %w( search.js ) - -# Add folder with webpack generated assets to assets.paths -Rails.application.config.assets.paths << Rails.root.join("public", "webpack", Rails.env) - -# Precompile additional assets. -# application.js, application.css, and all non-JS/CSS in app/assets folder are already added. -Rails.application.config.assets.precompile << "server-bundle.js" - -type = ENV["REACT_ON_RAILS_ENV"] == "HOT" ? "non_webpack" : "static" -Rails.application.config.assets.precompile += - [ - "application_#{type}.js", - "application_#{type}.css" - ] diff --git a/spec/react_on_rails/generators/install_generator_spec.rb b/spec/react_on_rails/generators/install_generator_spec.rb index 87b138b8f..6d61051bb 100644 --- a/spec/react_on_rails/generators/install_generator_spec.rb +++ b/spec/react_on_rails/generators/install_generator_spec.rb @@ -1,7 +1,6 @@ require_relative "../support/generator_spec_helper" require_relative "../support/version_test_helpers" -# rubocop:disable Metrics/BlockLength describe InstallGenerator, type: :generator do destination File.expand_path("../../dummy-for-generators/", __FILE__) @@ -45,16 +44,6 @@ include_examples "base_generator", application_js: true end - context "without existing assets.rb file" do - before(:all) { run_generator_test_with_args([], assets_rb: false) } - include_examples "base_generator", assets_rb: false - end - - context "with existing assets.rb file" do - before(:all) { run_generator_test_with_args([], assets_rb: true) } - include_examples "base_generator", assets_rb: true - end - context "with rails_helper" do before(:all) { run_generator_test_with_args([], spec: true) } it "adds ReactOnRails::TestHelper.configure_rspec_to_compile_assets(config)" do diff --git a/spec/react_on_rails/support/generator_spec_helper.rb b/spec/react_on_rails/support/generator_spec_helper.rb index da76f546b..094d6db85 100644 --- a/spec/react_on_rails/support/generator_spec_helper.rb +++ b/spec/react_on_rails/support/generator_spec_helper.rb @@ -31,27 +31,6 @@ def simulate_existing_rails_files(options) "RSpec.configure do |config|\nend\n") end -def simulate_existing_assets_files(options) - simulate_existing_file("config/initializers/assets.rb") if options.fetch(:assets_rb, true) - if options.fetch(:application_js, true) - app_js = "app/assets/javascripts/application.js" - app_js_data = <<-DATA.strip_heredoc - //= require jquery - //= require jquery_ujs - //= require jquery-ui - //= require turbolinks - //= require_tree . - DATA - simulate_existing_file(app_js, app_js_data) - end - - return unless options.fetch(:application_css, true) - - app_css = "app/assets/stylesheets/application.css.scss" - app_css_data = " *= require_tree .\n *= require_self\n" - simulate_existing_file(app_css, app_css_data) -end - def simulate_npm_files(options) if options.fetch(:package_json, false) package_json = "client/package.json" @@ -91,7 +70,6 @@ def simulate_npm_files(options) def run_generator_test_with_args(args, options = {}) prepare_destination # this completely wipes the `destination` directory simulate_existing_rails_files(options) - simulate_existing_assets_files(options) simulate_npm_files(options) yield if block_given? run_generator(args + ["--ignore-warnings"]) diff --git a/spec/react_on_rails/support/shared_examples/base_generator_examples.rb b/spec/react_on_rails/support/shared_examples/base_generator_examples.rb index 1ce30bb33..0c0e6159c 100644 --- a/spec/react_on_rails/support/shared_examples/base_generator_examples.rb +++ b/spec/react_on_rails/support/shared_examples/base_generator_examples.rb @@ -39,11 +39,6 @@ Procfile.dev).each { |file| assert_file(file) } end - it "appends path configurations to assets.rb" do - expected = ReactOnRails::Generators::BaseGenerator::ASSETS_RB_APPEND - assert_file("config/initializers/assets.rb") { |contents| assert_match(expected, contents) } - end - it "templates HelloWorldApp into webpack.config.js" do assert_file("client/webpack.config.js") do |contents| assert_match("registration", contents)