Rails 4 不更新 css 在 dev 中进行更改时
Rails 4 not updating css in dev when changes are made
我已经为此苦苦挣扎了一段时间,但基本上每次我对下面列出的 css 文件进行更改时(例如 layout.scss
),我都必须停止服务器和 运行 rake assets:clobber
然后在我看到更改之前重新启动服务器。
不用说,这非常乏味。以下是我的配置;请让我知道您是否还有其他需要我做的事 post。
Gemfile
source 'https://rubygems.org'
ruby '2.2.3'
# Bundle edge Rails instead: gem 'rails', github: 'rails/rails'
gem 'rails', '4.2.5'
# DB Tools
gem 'pg'
gem 'money-rails'
gem 'pluck_to_hash'
# View Development Tools
gem 'sassc-rails'
gem 'haml-rails'
gem 'friendly_id', '~> 5.1.0'
# View Display Tools
gem 'jquery-rails'
gem 'font-awesome-rails'
# Form Tools
gem "cocoon"
gem 'amoeba'
# Angular Tools
gem 'angularjs-rails', '~> 1.4.7'
gem 'angular-rails-templates'
gem 'angular_rails_csrf'
# API Tools
gem 'active_model_serializers', '~> 0.10.0.rc2'
gem 'easy_diff'
# Authentication / Authorization
gem 'devise'
# Use Uglifier as compressor for JavaScript assets
gem 'uglifier', '>= 1.3.0'
gem 'sdoc', '~> 0.4.0', group: :doc
# Hosting, Serving & Deployment
gem 'puma'
gem 'foreman'
# Env specific
group :development do
gem 'awesome_print', :require => 'ap'
gem "better_errors"
gem "binding_of_caller"
gem 'annotate', '~> 2.6.6'
gem 'seed_dump'
end
group :development, :test do
gem 'byebug'
gem 'web-console', '~> 2.0'
gem 'spring'
end
development.rb
Rails.application.configure do
config.cache_classes = false
config.eager_load = false
config.consider_all_requests_local = true
config.action_controller.perform_caching = false
config.action_mailer.raise_delivery_errors = true
config.active_support.deprecation = :log
config.active_record.migration_error = :page_load
config.assets.debug = true
config.assets.prefix = "/dev-assets"
config.assets.digest = false
config.serve_static_files = false
config.assets.raise_runtime_errors = true
config.sass.inline_source_maps = true
config.action_mailer.default_url_options = { host: 'localhost', port: 8080 }
config.action_mailer.delivery_method = :smtp
config.action_mailer.smtp_settings = {
address: "smtp.gmail.com",
port: 587,
domain: ENV["GMAIL_DOMAIN"],
user_name: ENV["GMAIL_USERNAME"],
password: ENV["GMAIL_PASSWORD"],
authentication: "plain",
enable_starttls_auto: true
}
end
application.css
/*
*= require_self
*= require application-loader
*/
申请-loader.scss
// common/
@import 'common/flexbox.scss';
@import 'common/baseline.scss';
@import 'common/fonts.scss';
@import 'common/mixins.scss';
@import 'common/common.scss';
@import 'common/forms.scss';
@import 'common/layout.scss';
@import 'common/pages.scss';
@import 'common/svg.scss';
@import 'authenticated/modules/stats.scss';
// authenticated/
@import 'application/application-layout.scss';
@import 'application/application-forms.scss';
您认为我们需要在 'initialisers/assets.rb' 中添加文件吗?这对我有用过一次。
在追寻@gates 在我最初回答的评论中提出的想法后,我遇到了 this blog post
基本上,由于 sprockets
没有进行加载,似乎它没有重新编译对单个文件的更改(尽管我不知道为什么整体重新编译没有更新),所以根据博客的说明,我现在 sprockets
加载所有文件,并根据需要导入 mixins。像这样:
application.css
/*
*= require_tree ./common
*= require_tree ./authenticated
*= require font-awesome
*= require_self
*/
authenticated/authenticated-layout.scss
@import '../flexbox.scss';
@import '../mixins.scss';
body {
// etc...
}
我现在可以更改我的任何 scss 文件并重新加载页面,而不必破坏资产 and/or 重新启动服务器!
我已经为此苦苦挣扎了一段时间,但基本上每次我对下面列出的 css 文件进行更改时(例如 layout.scss
),我都必须停止服务器和 运行 rake assets:clobber
然后在我看到更改之前重新启动服务器。
不用说,这非常乏味。以下是我的配置;请让我知道您是否还有其他需要我做的事 post。
Gemfile
source 'https://rubygems.org'
ruby '2.2.3'
# Bundle edge Rails instead: gem 'rails', github: 'rails/rails'
gem 'rails', '4.2.5'
# DB Tools
gem 'pg'
gem 'money-rails'
gem 'pluck_to_hash'
# View Development Tools
gem 'sassc-rails'
gem 'haml-rails'
gem 'friendly_id', '~> 5.1.0'
# View Display Tools
gem 'jquery-rails'
gem 'font-awesome-rails'
# Form Tools
gem "cocoon"
gem 'amoeba'
# Angular Tools
gem 'angularjs-rails', '~> 1.4.7'
gem 'angular-rails-templates'
gem 'angular_rails_csrf'
# API Tools
gem 'active_model_serializers', '~> 0.10.0.rc2'
gem 'easy_diff'
# Authentication / Authorization
gem 'devise'
# Use Uglifier as compressor for JavaScript assets
gem 'uglifier', '>= 1.3.0'
gem 'sdoc', '~> 0.4.0', group: :doc
# Hosting, Serving & Deployment
gem 'puma'
gem 'foreman'
# Env specific
group :development do
gem 'awesome_print', :require => 'ap'
gem "better_errors"
gem "binding_of_caller"
gem 'annotate', '~> 2.6.6'
gem 'seed_dump'
end
group :development, :test do
gem 'byebug'
gem 'web-console', '~> 2.0'
gem 'spring'
end
development.rb
Rails.application.configure do
config.cache_classes = false
config.eager_load = false
config.consider_all_requests_local = true
config.action_controller.perform_caching = false
config.action_mailer.raise_delivery_errors = true
config.active_support.deprecation = :log
config.active_record.migration_error = :page_load
config.assets.debug = true
config.assets.prefix = "/dev-assets"
config.assets.digest = false
config.serve_static_files = false
config.assets.raise_runtime_errors = true
config.sass.inline_source_maps = true
config.action_mailer.default_url_options = { host: 'localhost', port: 8080 }
config.action_mailer.delivery_method = :smtp
config.action_mailer.smtp_settings = {
address: "smtp.gmail.com",
port: 587,
domain: ENV["GMAIL_DOMAIN"],
user_name: ENV["GMAIL_USERNAME"],
password: ENV["GMAIL_PASSWORD"],
authentication: "plain",
enable_starttls_auto: true
}
end
application.css
/*
*= require_self
*= require application-loader
*/
申请-loader.scss
// common/
@import 'common/flexbox.scss';
@import 'common/baseline.scss';
@import 'common/fonts.scss';
@import 'common/mixins.scss';
@import 'common/common.scss';
@import 'common/forms.scss';
@import 'common/layout.scss';
@import 'common/pages.scss';
@import 'common/svg.scss';
@import 'authenticated/modules/stats.scss';
// authenticated/
@import 'application/application-layout.scss';
@import 'application/application-forms.scss';
您认为我们需要在 'initialisers/assets.rb' 中添加文件吗?这对我有用过一次。
在追寻@gates 在我最初回答的评论中提出的想法后,我遇到了 this blog post
基本上,由于 sprockets
没有进行加载,似乎它没有重新编译对单个文件的更改(尽管我不知道为什么整体重新编译没有更新),所以根据博客的说明,我现在 sprockets
加载所有文件,并根据需要导入 mixins。像这样:
application.css
/*
*= require_tree ./common
*= require_tree ./authenticated
*= require font-awesome
*= require_self
*/
authenticated/authenticated-layout.scss
@import '../flexbox.scss';
@import '../mixins.scss';
body {
// etc...
}
我现在可以更改我的任何 scss 文件并重新加载页面,而不必破坏资产 and/or 重新启动服务器!