2016-02-18 119 views
3

有沒有辦法在開發環境中使用Rails應用程序執行「熱代碼重新加載」?如何在Rails中啓用自動代碼重新加載

例如:我正在研究Rails應用程序,我在樣式表中添加了幾行css,我查看瀏覽器以查看修改的樣式。截至目前,我必須刷新頁面cmd-r或點擊刷新按鈕。

有沒有辦法讓頁面在更改時自動重新加載?

這在鳳凰網框架中很好地工作(我相信鳳凰城不是這個功能的唯一框架)。在Ruby on Rails中如何啓用這樣的功能?

回答

1

當您更改js元素(不是css或ruby文件)時,此gem會自動重新加載。

https://github.com/rmosolgo/react-rails-hot-loader

從未見過的CSS熱碼在軌平臺重裝。

+1

對 - 這對於在Rails中自動重新載入JavaScript很有用。我正在尋找的東西,至少會自動重新加載整個資產管道,雖然(JS和CSS - 自動重新加載模型,控制器和視圖也不錯)。 –

2

我使用這個設置重新加載的所有資產,JS,CSS,Ruby文件

在Gemfile中

group :development, :test do 
    gem 'guard-livereload', '~> 2.5', require: false 
end 

group :development do 
gem 'listen' 
gem 'guard' 
gem 'guard-zeus' 
gem 'rack-livereload' 
end 

插入這在development.rb

config.middleware.insert_after ActionDispatch::Static, Rack::LiveReload 

我有這個在我的後衛文件

# A sample Guardfile 
# More info at https://github.com/guard/guard#readme 

## Uncomment and set this to only include directories you want to watch 
# directories %w(app lib config test spec features) \ 
# .select{|d| Dir.exists?(d) ? d : UI.warning("Directory #{d} does not exist")} 

## Note: if you are using the `directories` clause above and you are not 
## watching the project directory ('.'), then you will want to move 
## the Guardfile to a watched dir and symlink it back, e.g. 
# 
# $ mkdir config 
# $ mv Guardfile config/ 
# $ ln -s config/Guardfile . 
# 
# and, you'll have to watch "config/Guardfile" instead of "Guardfile" 

guard 'livereload' do 
    extensions = { 
    css: :css, 
    scss: :css, 
    sass: :css, 
    js: :js, 
    coffee: :js, 
    html: :html, 
    png: :png, 
    gif: :gif, 
    jpg: :jpg, 
    jpeg: :jpeg, 
    # less: :less, # uncomment if you want LESS stylesheets done in browser 
    } 

    rails_view_exts = %w(erb haml slim) 

    # file types LiveReload may optimize refresh for 
    compiled_exts = extensions.values.uniq 
    watch(%r{public/.+\.(#{compiled_exts * '|'})}) 

    extensions.each do |ext, type| 
    watch(%r{ 
      (?:app|vendor) 
      (?:/assets/\w+/(?<path>[^.]+) # path+base without extension 
      (?<ext>\.#{ext})) # matching extension (must be first encountered) 
      (?:\.\w+|$) # other extensions 
      }x) do |m| 
     path = m[1] 
     "/assets/#{path}.#{type}" 
    end 
    end 

    # file needing a full reload of the page anyway 
    watch(%r{app/views/.+\.(#{rails_view_exts * '|'})$}) 
    watch(%r{app/helpers/.+\.rb}) 
    watch(%r{config/locales/.+\.yml}) 
end 

guard 'zeus' do 
    require 'ostruct' 

    rspec = OpenStruct.new 
    # rspec.spec_dir = 'spec' 
    # rspec.spec = ->(m) { "#{rspec.spec_dir}/#{m}_spec.rb" } 
    # rspec.spec_helper = "#{rspec.spec_dir}/spec_helper.rb" 

    # matchers 
    # rspec.spec_files = /^#{rspec.spec_dir}\/.+_spec\.rb$/ 

    # Ruby apps 
    ruby = OpenStruct.new 
    ruby.lib_files = /^(lib\/.+)\.rb$/ 

    # watch(rspec.spec_files) 
    # watch(rspec.spec_helper) { rspec.spec_dir } 
    # watch(ruby.lib_files) { |m| rspec.spec.call(m[1]) } 

    # Rails example 
    rails = OpenStruct.new 
    rails.app_files = /^app\/(.+)\.rb$/ 
    rails.views_n_layouts = /^app\/(.+(?:\.erb|\.haml|\.slim))$/ 
    rails.controllers = %r{^app/controllers/(.+)_controller\.rb$} 

    # watch(rails.app_files) { |m| rspec.spec.call(m[1]) } 
    # watch(rails.views_n_layouts) { |m| rspec.spec.call(m[1]) } 
    # watch(rails.controllers) do |m| 
    # [ 
    #  rspec.spec.call("routing/#{m[1]}_routing"), 
    #  rspec.spec.call("controllers/#{m[1]}_controller"), 
    #  rspec.spec.call("acceptance/#{m[1]}") 
    # ] 
    # end 
end 

我使用此設置宙斯,而不是春季。

運行guard

打開本地主機:3000,你是好去。

這應該可以解決您的問題,並且具有比browserify更好的重載時間。

如果你想要,你可以取消註釋那些行,如果你正在做TDD,

+0

我試過這個,但是當試圖在'public-ip:3000'上訪問我的應用程序時,我得到了'連接被拒絕'錯誤(端口未打開)。 –

+1

爲什麼public-ip和localhost不一樣? – gustavoanalytics

+0

我在本地運行Windows,無法安裝最新的Ruby。我正在使用遠程Linux服務器進行開發。同時,我設法使用'browsersync'進行實時重載。但是我想再問一次關於'guard-livereload'的問題,你是否仍然需要安裝chrome擴展? –

相關問題