Add Timestamps to Compiled SASS/Scss

Add timestamps to compiled sass/scss

I don't know of any built-in SASS or Compass feature for this, but it's not too hard to add a custom Ruby function to do it. (See the section entitled "Adding Custom Functions" in the SASS reference here.)

Your file with the Ruby function would look like this (let's call it "timestamp.rb"):

module Sass::Script::Functions
    def timestamp()
        return Sass::Script::String.new(Time.now.to_s)
    end
end

And you'd reference the new timestamp function in your SASS file like this:

/*!
 * CSS Compiled on: #{timestamp()}
 */

You just need to make sure your "timestamp.rb" file is loaded when you compile the SASS, either by requiring it from a Compass config file, or by using the --require parameter with the SASS command line. When all is said and done, you should get output like the following:

/*
 * CSS Compiled on: 2012-10-23 08:53:03 -0400
 */

Add timestamps to compiled javascript

Yes.

Sprockets provides an ERB engine for preprocessing assets using embedded Ruby code. Append .erb to a CSS or JavaScript asset's filename to enable the ERB engine.

Sprockets processes multiple engine extensions in order from right to left, so you can use multiple engines with a single asset. For example, to have a CoffeeScript asset that is first preprocessed with ERB, use the extension .js.coffee.erb

(The above is from the Sprockets README)

For example, if you have a file hello.js.coffee.erb then you can put this in it:

<%= Time.now.utc.to_s %>

Sass watch command compiles .scss files before full sftp upload

For the one in a billion facing the same problem (I know you are out there), time to answer to my tumbleweed:

The Solution is simple

Do the exact opposite:

1. Install ruby and then sass on your pc.
2. Tell sass to watch for changes between scss/css files locally with:sass --watch scss/style.scss:css/style.css
3. Set WinSCP local dir on the css folder which is watched by sass.
4. Set the WinSCP remote dir on the css folder you want to edit.
5. Set WinSCP to keep remote dir up to date from the Commands > Keep remote directory up to date menu.

That's it.

If you edit and save your local scss file, sass will compile it into css, then WinSCP will detect the change on the css and automatically upload it to the remote folder.

SASS: Set variable at compile time

I found this at their FAQ http://sass-lang.com/docs/yardoc/file.FAQ.html

If you just want to pass some variables to the CSS every time it gets compiled, like using --watch, you can use Sass functions to define Ruby scripts to even query a database. But the code is going to be compiled only once, and served statically.

But if you need to recompile it at every request with different options,

you can use Sass::Engine to render the code, using the :custom option
to pass in data that can be accessed from your Sass functions

Seems like it's not recommended, though. Probably for performance reasons.

---

Related Topics