8

Description

What you are reporting: I am following this set of instructions on how to setup React hot loarder. But when I go to step 3 where I put the patch, it breaks in to the one below.

Expected behavior

What you think should happen: Should work properly

Actual behavior

image

Environment

React Hot Loader version: next

Run these commands in the project folder and fill in their results:

  1. node -v: 7.9.0
  2. npm -v: 4.2.0

Then, specify:

  1. Operating system: Windows 10
  2. Browser and version: Latest Chrome

Reproducible Demo

https://github.com/abarcenas29/preact-sandbox-v0/blob/wip/hot-reloader/src/main.js

branch: wip-hot-reloader

Instructions:

  • yarn
  • yarn run postinstall
  • yarn run start:dev

Route users to different paths according to information entered in rails

My userinfos controller handles user information. As soon as the user signs up, I want them to go to the page that lets them fill out the user information like name, email, gpa, college...Lets just say they leave before completing the form, when they sign in again, I want to check if the user information has been filled out, if not, I want to take them to enter the new information page. To do this, I added the "info_complete" function to my userinfo model(as shown below). Here are my two models which will tell you the relationship between them.

Userinfo model:

class Userinfo < ActiveRecord::Base
    belongs_to :user
    has_many :videos, through: :user

    def info_complete?
        name? && email? && college? && gpa? && major?
    end
end

User model:

class User < ActiveRecord::Base
  has_many :userinfos
  has_many :videos

  # Include default devise modules. Others available are:
  # :confirmable, :lockable, :timeoutable and :omniauthable
  devise :database_authenticatable, :registerable,
         :recoverable, :rememberable, :trackable, :validatable
end

Then I added the following code to the application controller. My application controller:

class ApplicationController < ActionController::Base
  protect_from_forgery with: :exception

  def after_sign_in_path_for(resource)
    if resource.userinfo.info_complete?
      redirect_to root_path
    else 
      redirect_to new_user_info_path
    end
  end
end

When I try to log in after saving this, I get the following error:enter image description here

Full error trace:

activemodel (4.2.3) lib/active_model/attribute_methods.rb:433:in `method_missing'
app/controllers/application_controller.rb:5:in `after_sign_in_path_for'
devise (4.3.0) app/controllers/devise/sessions_controller.rb:21:in `create'
actionpack (4.2.3) lib/action_controller/metal/implicit_render.rb:4:in `send_action'
actionpack (4.2.3) lib/abstract_controller/base.rb:198:in `process_action'
actionpack (4.2.3) lib/action_controller/metal/rendering.rb:10:in `process_action'
actionpack (4.2.3) lib/abstract_controller/callbacks.rb:20:in `block in process_action'
activesupport (4.2.3) lib/active_support/callbacks.rb:115:in `call'
activesupport (4.2.3) lib/active_support/callbacks.rb:553:in `block (2 levels) in compile'
activesupport (4.2.3) lib/active_support/callbacks.rb:503:in `call'
activesupport (4.2.3) lib/active_support/callbacks.rb:88:in `run_callbacks'
actionpack (4.2.3) lib/abstract_controller/callbacks.rb:19:in `process_action'
actionpack (4.2.3) lib/action_controller/metal/rescue.rb:29:in `process_action'
actionpack (4.2.3) lib/action_controller/metal/instrumentation.rb:32:in `block in process_action'
activesupport (4.2.3) lib/active_support/notifications.rb:164:in `block in instrument'
activesupport (4.2.3) lib/active_support/notifications/instrumenter.rb:20:in `instrument'
activesupport (4.2.3) lib/active_support/notifications.rb:164:in `instrument'
actionpack (4.2.3) lib/action_controller/metal/instrumentation.rb:30:in `process_action'
actionpack (4.2.3) lib/action_controller/metal/params_wrapper.rb:250:in `process_action'
activerecord (4.2.3) lib/active_record/railties/controller_runtime.rb:18:in `process_action'
actionpack (4.2.3) lib/abstract_controller/base.rb:137:in `process'
actionview (4.2.3) lib/action_view/rendering.rb:30:in `process'
actionpack (4.2.3) lib/action_controller/metal.rb:196:in `dispatch'
actionpack (4.2.3) lib/action_controller/metal/rack_delegation.rb:13:in `dispatch'
actionpack (4.2.3) lib/action_controller/metal.rb:237:in `block in action'
actionpack (4.2.3) lib/action_dispatch/routing/route_set.rb:76:in `dispatch'
actionpack (4.2.3) lib/action_dispatch/routing/route_set.rb:45:in `serve'
actionpack (4.2.3) lib/action_dispatch/routing/mapper.rb:49:in `serve'
actionpack (4.2.3) lib/action_dispatch/journey/router.rb:43:in `block in serve'
actionpack (4.2.3) lib/action_dispatch/journey/router.rb:30:in `each'
actionpack (4.2.3) lib/action_dispatch/journey/router.rb:30:in `serve'
actionpack (4.2.3) lib/action_dispatch/routing/route_set.rb:821:in `call'
warden (1.2.7) lib/warden/manager.rb:36:in `block in call'
warden (1.2.7) lib/warden/manager.rb:35:in `catch'
warden (1.2.7) lib/warden/manager.rb:35:in `call'
rack (1.6.8) lib/rack/etag.rb:24:in `call'
rack (1.6.8) lib/rack/conditionalget.rb:38:in `call'
rack (1.6.8) lib/rack/head.rb:13:in `call'
actionpack (4.2.3) lib/action_dispatch/middleware/params_parser.rb:27:in `call'
actionpack (4.2.3) lib/action_dispatch/middleware/flash.rb:260:in `call'
rack (1.6.8) lib/rack/session/abstract/id.rb:225:in `context'
rack (1.6.8) lib/rack/session/abstract/id.rb:220:in `call'
actionpack (4.2.3) lib/action_dispatch/middleware/cookies.rb:560:in `call'
activerecord (4.2.3) lib/active_record/query_cache.rb:36:in `call'
activerecord (4.2.3) lib/active_record/connection_adapters/abstract/connection_pool.rb:653:in `call'
activerecord (4.2.3) lib/active_record/migration.rb:377:in `call'
actionpack (4.2.3) lib/action_dispatch/middleware/callbacks.rb:29:in `block in call'
activesupport (4.2.3) lib/active_support/callbacks.rb:84:in `run_callbacks'
actionpack (4.2.3) lib/action_dispatch/middleware/callbacks.rb:27:in `call'
actionpack (4.2.3) lib/action_dispatch/middleware/reloader.rb:73:in `call'
actionpack (4.2.3) lib/action_dispatch/middleware/remote_ip.rb:78:in `call'
actionpack (4.2.3) lib/action_dispatch/middleware/debug_exceptions.rb:17:in `call'
web-console (2.3.0) lib/web_console/middleware.rb:28:in `block in call'
web-console (2.3.0) lib/web_console/middleware.rb:18:in `catch'
web-console (2.3.0) lib/web_console/middleware.rb:18:in `call'
actionpack (4.2.3) lib/action_dispatch/middleware/show_exceptions.rb:30:in `call'
railties (4.2.3) lib/rails/rack/logger.rb:38:in `call_app'
railties (4.2.3) lib/rails/rack/logger.rb:20:in `block in call'
activesupport (4.2.3) lib/active_support/tagged_logging.rb:68:in `block in tagged'
activesupport (4.2.3) lib/active_support/tagged_logging.rb:26:in `tagged'
activesupport (4.2.3) lib/active_support/tagged_logging.rb:68:in `tagged'
railties (4.2.3) lib/rails/rack/logger.rb:20:in `call'
actionpack (4.2.3) lib/action_dispatch/middleware/request_id.rb:21:in `call'
rack (1.6.8) lib/rack/methodoverride.rb:22:in `call'
rack (1.6.8) lib/rack/runtime.rb:18:in `call'
activesupport (4.2.3) lib/active_support/cache/strategy/local_cache_middleware.rb:28:in `call'
rack (1.6.8) lib/rack/lock.rb:17:in `call'
actionpack (4.2.3) lib/action_dispatch/middleware/static.rb:116:in `call'
rack (1.6.8) lib/rack/sendfile.rb:113:in `call'
railties (4.2.3) lib/rails/engine.rb:518:in `call'
railties (4.2.3) lib/rails/application.rb:165:in `call'
rack (1.6.8) lib/rack/lock.rb:17:in `call'
rack (1.6.8) lib/rack/content_length.rb:15:in `call'
rack (1.6.8) lib/rack/handler/webrick.rb:88:in `service'
C:/tools/ruby23/lib/ruby/2.3.0/webrick/httpserver.rb:140:in `service'
C:/tools/ruby23/lib/ruby/2.3.0/webrick/httpserver.rb:96:in `run'
C:/tools/ruby23/lib/ruby/2.3.0/webrick/server.rb:296:in `block in start_thread'

Any help is appreciated. Thanks!

4

1 回答 1

10

我没有足够的声誉来发表评论，所以我必须写一个不完全解决问题的答案，但仍然......

您收到的错误是由于react-hot-loader/patch需要实际模块并用新react模块修补其功能。createElement在这里看到它：react-hot-loader/lib/patch.dev.js:179

主要问题是webpack 配置 react模块被解析为preact-compat显然不允许设置新值，因此热重载无法一起运行。

希望这能回答你的问题。照原样 - 我认为热重载在该设置中不起作用。

编辑： 找到一个简单的解决方案。将webpack.config.js解析块更改为此，以指向react您自己的脚本：

// resolve for preact
webpack.resolve = {
  alias: {
    react: path.resolve(__dirname, 'react.js')
    // the rest goes as before
  }
}

现在创建react.js文件并将其放入其中（根据需要更改路径和名称）：

var preact = require('preact-compat');

var react = {};
// Copy object properties to a new object which will allow react-hot-loader to do its magic
Object.keys(preact).forEach(function(key) {
    react[key] = preact[key];
});

module.exports = react;

并做了！HMR 现在正在工作。

于 2017-06-01T09:55:54.940 回答