【问题标题】:How do I minify CSS in Rails 4?如何在 Rails 4 中缩小 CSS?
【发布时间】:2014-04-08 13:40:57
【问题描述】:

我尝试了以下方法,但是我查看了 CSS 源代码,但它并没有缩小!我重新启动了服务器几十次。我在浏览器中关闭了缓存。我还尝试了 'yui-compressor' gem。

config/environments/development.rb

  config.assets.debug = false
  config.assets.css_compressor = :sass
  config.assets.compile = true

宝石文件

group :assets do
  # Add any compass extensions here
  # Use SCSS for stylesheets
  gem 'sass-rails', '~> 4.0.0'

参考

http://edgeguides.rubyonrails.org/asset_pipeline.html#customizing-the-pipeline

版本

WEBrick 1.3.1, 红宝石 2.0.0 (2013-06-27) [i386-mingw32],Rails 4.0.3

【问题讨论】:

  • 如果您在开发环境中,这是正常的:资产应该在部署期间压缩并在生产环境中使用压缩
  • 我部署了它,它仍然不会压缩。它在 CSS 中有 cmets!我在production.rb 中设置了config.assets.css_compressor = :sass。我使用git push heroku 进行部署。
  • 如何部署?使用 capistrano 还是手动?

标签: css ruby-on-rails ruby ruby-on-rails-4 sass


【解决方案1】:

这对我有用rails-html-css-js-gzip-compression Ruby 2.2.0 - Rails 4.2.0

【讨论】:

  • 作者自己承认不应该使用这种方法,因为它给every.single.request增加了很大的开销。
【解决方案2】:

这对我来说失败了,因为我有 image-url("/img/header/gradient.png") 而不是 image-url("img/header/gradient.png")。寓意:不要在路径的开头使用斜线。

【讨论】:

  • 这和问题有什么关系?
  • 我花了几个小时调试缺少斜线导致指纹无法正常工作的情况。我想让其他人知道为什么 CSS 会在没有指纹识别的情况下缩小。
【解决方案3】:

我在生产环境中遇到了同样的问题,在部署到 Heroku 时我无法缩小 CSS。使用以下命令打开压缩后:

production.rb

config.assets.css_compressor = :sass

宝石文件

gem 'sass-rails', '~> 4.0.0'    

我设法通过更新资产版本来缩小它:

production.rb

config.assets.version = '1.1' # was '1.0'

之后做了一些测试,我发现更新源 CSS/SASS 有同样的效果。因此,请尝试更新您的样式表(而不仅仅是配置),当 Heroku 在您推送后预编译您的资产时,这应该“启动”缩小过程,而无需更新资产版本。

【讨论】:

    【解决方案4】:

    预编译

    您需要precompile the assets

    如果您预编译它们,Rails 会缩小您的资产。这仅用于生产,但意味着您可以使用带有压缩代码的文件,例如 application.jsapplication.css

    试试这个:

    $ rake assets:precompile RAILS_ENV=production
    $ git add .
    $ git commit -a -m "Precompiled Assets"
    $ git push heroku master
    

    这将预编译(和缩小)您的资产,允许您在生产中使用已编译的文件

    【讨论】:

    • Heroku 不是已经自动编译资产了吗? Preparing app for Rails asset pipeline Running: rake assets:precompile Asset precompilation completed (3.64s) Cleaning assets Running: rake assets:clean。如何查看开发中的缩小版本,以测试一切是否正常? JS被缩小了。有没有一种方法可以缩小 CSS,而不必记住每次都将其签入 GIT,并且每次部署时都会弄乱文件系统?
    猜你喜欢
    • 2012-03-11
    • 1970-01-01
    • 1970-01-01
    • 2013-02-21
    • 2011-10-20
    • 1970-01-01
    • 1970-01-01
    • 2017-05-28
    • 2019-06-15
    相关资源
    最近更新 更多