rails mimic production asset precompile in development to resolve css compilation fail

Question

I am trying to figure out why my application.css.scss file is not precompiling correctly on my staging environment. I have tried to replicate the error locally by replacing my local environments file to be the same as my staging one. Everything still works on development after precompiling (but not uglified which is not expected) even though I am using the staging environments settings for my local.

My settings are below

Rails.application.configure do
  # Settings specified here will take precedence over those in config/application.rb.

  # Code is not reloaded between requests.
  config.cache_classes = true

  # Eager load code on boot. This eager loads most of Rails and
  # your application in memory, allowing both threaded web servers
  # and those relying on copy on write to perform better.
  # Rake tasks automatically ignore this option for performance.
  config.eager_load = true

  # Full error reports are disabled and caching is turned on.
  config.consider_all_requests_local       = false
  config.action_controller.perform_caching = true

  # Enable Rack::Cache to put a simple HTTP cache in front of your application
  # Add `rack-cache` to your Gemfile before enabling this.
  # For large-scale production use, consider using a caching reverse proxy like nginx, varnish or squid.
  # config.action_dispatch.rack_cache = true

  # Disable Rails's static asset server (Apache or nginx will already do this).
  config.serve_static_assets = false

  # Compress JavaScripts and CSS.
  config.assets.js_compressor = :uglifier
  # config.assets.css_compressor = :sass

  # Do not fallback to assets pipeline if a precompiled asset is missed.
  config.assets.compile = false

  # Generate digests for assets URLs.
  config.assets.digest = true

  # `config.assets.precompile` has moved to config/initializers/assets.rb

  # Specifies the header that your server uses for sending files.
  # config.action_dispatch.x_sendfile_header = "X-Sendfile" # for apache
  # config.action_dispatch.x_sendfile_header = 'X-Accel-Redirect' # for nginx

  # Force all access to the app over SSL, use Strict-Transport-Security, and use secure cookies.
  # config.force_ssl = true

  # Set to :debug to see everything in the log.
  config.log_level = :info

  # Prepend all log lines with the following tags.
  # config.log_tags = [ :subdomain, :uuid ]

  # Use a different logger for distributed setups.
  # config.logger = ActiveSupport::TaggedLogging.new(SyslogLogger.new)

  # Use a different cache store in production.
  # config.cache_store = :mem_cache_store

  # Enable serving of images, stylesheets, and JavaScripts from an asset server.
  # config.action_controller.asset_host = "http://assets.example.com"

  # Precompile additional assets.
  # application.js, application.css, and all non-JS/CSS in app/assets folder are already added.
  # config.assets.precompile += %w( search.js )

  # Ignore bad email addresses and do not raise email delivery errors.
  # Set this to true and configure the email server for immediate delivery to raise delivery errors.
  config.action_mailer.raise_delivery_errors = false
  config.action_mailer.default_url_options = { :host => '' }
  config.action_mailer.perform_deliveries = true
  config.action_mailer.delivery_method = :smtp
  config.action_mailer.smtp_settings = {
    :address              => "smtp.gmail.com",
    :port                 => 587,
    :user_name            => '',
    :password             => '',
    :authentication       => 'plain',
  :enable_starttls_auto => true  }

  # Enable locale fallbacks for I18n (makes lookups for any locale fall back to
  # the I18n.default_locale when a translation cannot be found).
  config.i18n.fallbacks = true

  # Send deprecation notices to registered listeners.
  config.active_support.deprecation = :notify

  # Disable automatic flushing of the log to improve performance.
  # config.autoflush_log = false

  # Use default logging formatter so that PID and timestamp are not suppressed.
  config.log_formatter = ::Logger::Formatter.new

  # Do not dump schema after migrations.
  config.active_record.dump_schema_after_migration = false
end

My application.html file

doctype html
html
  head
    meta[name="viewport" content="width=device-width, initial-scale=1.0"]
    title
      = content_for?(:title) ? yield(:title) : 'Phoenix'
    meta name="description" content="#{content_for?(:description) ? yield(:description) : 'Phoenix'}"
    = stylesheet_link_tag "application", :media => 'all'
    = stylesheet_link_tag 'http://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,400,300,600,700' 
    = javascript_include_tag 'vendor/modernizr'
    = javascript_include_tag 'application'
    = csrf_meta_tags
  body
    .off-canvas-wrap data-offcanvas="" 
      .inner-wrap
        nav.tab-bar
          - if user_signed_in?
            section.left-small
              a.left-off-canvas-toggle.menu-icon
                span
          section.middle.tab-bar-section
            span.left 
               = link_to 'Phoenix', root_path
            - if user_signed_in?
              .right
                = link_to current_user.email, user_path(current_user.id) 
                = "  ".html_safe
                = link_to fa_icon("sign-out"), destroy_user_session_path, id:"sign-out", method: :delete
            - else
              span.right 
                = link_to 'Sign in', new_user_session_path
        - if user_signed_in?
          aside.left-off-canvas-menu
            ul.off-canvas-list
              = render 'layouts/navigation'

        section.main-section
          .full-width-row
            .columns class=(user_signed_in? ? 'medium-10 small-centered' : 'medium-5 small-centered')
              main[role="main"]
                = render 'layouts/messages'
                = yield
        a.exit-off-canvas

My application.css.scss file

/*
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS and SCSS file within this directory, lib/assets/stylesheets, vendor/assets/stylesheets,
 * or vendor/assets/stylesheets of plugins, if any, can be referenced here using a relative path.
 *
 * You're free to add application-wide styles to this file and they'll appear at the bottom of the
 * compiled file so the styles you add here take precedence over styles defined in any styles
 * defined in the other CSS/SCSS files in this directory. It is generally better to create a new
 * file per style scope.
 *
 *= require_self
 *= require_tree ../../../vendor/assets/stylesheets/.
 *= require selectize
 *= require selectize.default
 *= require chosen
 */
 @import 'foundation_and_overrides';
 @import 'mixins'; 
 @import 'font-awesome';
 @import 'layout';
 @import 'shame';

Note

I have cleared my assets using rake assets:clean RAILS_ENV=[environment] and rake assets:clobber RAILS_ENV=[environment]
I have also tried to delete the files manually
I have restarted the server on multiple occasions
This has been an intermitted error that seems to have popped up a couple of times, but it randomly disappears

So I guess I have two questions

Why can't I replicate this locally? (this would be a huge help)
Why is it happening in the first place?

Any input appreciated.

Ryan-Neal Mes · Accepted Answer

After more investigation and looking into the public/assets more it seems the css file was being generated, but the URL was incorrect to the file. It seems I needed to update the default css_compressor to sass

config.assets.css_compressor = :sass

I would have thought this would be defaulted already, but I guess not.

Still not sure why I can't replicate this locally though

rails mimic production asset precompile in development to resolve css compilation fail

Answers (1)

Related Questions