diff --git a/lib/modules/sass.coffee b/lib/modules/sass.coffee index f0fe73f..5285d68 100644 --- a/lib/modules/sass.coffee +++ b/lib/modules/sass.coffee @@ -1,47 +1,45 @@ fs = require 'fs' -pathutil = require 'path' - -sassy = require "node-sassy" - +path = require 'path' {Asset} = require '../.' +try + sassy = false + sass = require 'node-sass' +catch err + sassy = true + sass = require 'node-sassy' + sass.render = (opts) -> + sassOpts = includeFrom: opts.includePaths, '--style': opts.outputStyle + sass.compile opts.file, sassOpts, (err, css) -> + return opts.error err if err? + opts.success css + urlRegex = /url\s*\(\s*(['"])((?:(?!\1).)+)\1\s*\)/ urlRegexGlobal = /url\s*\(\s*(['"])((?:(?!\1).)+)\1\s*\)/g class exports.SassAsset extends Asset - mimetype: 'text/css' - - create: (options) -> - @filename = pathutil.resolve options.filename - @toWatch = pathutil.dirname @filename - @paths = options.paths - @paths ?= [] - @paths.push pathutil.dirname options.filename - - @compress = options.compress - @compress ?= false - - sassOpts = {} - if options.paths - sassOpts.includeFrom = options.paths - - if @compress - sassOpts["--style"] = "compressed" - - # Render the sass to css - sassy.compile @filename, sassOpts, (err, css) => - return @emit 'error', err if err? - - if @rack? - results = css.match urlRegexGlobal - if results - for result in results - match = urlRegex.exec result - quote = match[1] - url = match[2] - specificUrl = @rack.url url - if specificUrl? - css = css.replace result, "url(#{quote}#{specificUrl}#{quote})" - - @emit 'created', - contents: css + @sassy: sassy + mimetype: 'text/css' + + postProcess: (css) -> + return css unless @rack? + results = css.match urlRegexGlobal + return css unless results? + for result in results + match = urlRegex.exec result + quote = match[1] + url = match[2] + specificUrl = @rack.url url + css = css.replace result, "url(#{quote}#{specificUrl}#{quote})" if specificUrl? + css + + create: (options) -> + throw new Error 'Invalid options' unless options? and options.filename? + @filename = path.resolve options.filename + @toWatch = path.dirname @filename + sass.render + file: @filename + includePaths: options.paths ? [path.dirname options.filename] + outputStyle: if options.compress then 'compressed' else 'nested' + error: (err) => @emit 'error', err + success: (css) => @emit 'created', contents: @postProcess css \ No newline at end of file diff --git a/package.json b/package.json index ceb452e..2404f0a 100644 --- a/package.json +++ b/package.json @@ -18,7 +18,7 @@ "underscore": "1.4.4", "coffee-script": "~1.6.2", "markdown": "0.4.0", - "node-sassy": "0.0.1" + "node-sassy": "~0.0.1" }, "devDependencies": { "express.io": "1.1.8", @@ -26,6 +26,9 @@ "mocha": "1.8.1", "chai": "1.4.2" }, + "optionalDependencies": { + "node-sass": "~0.5.0" + }, "scripts": { "test": "./node_modules/mocha/bin/mocha test/test.coffee", "compile": "./node_modules/coffee-script/bin/coffee -o compiled/ -c lib/", diff --git a/test/fixtures/sass/another.css b/test/fixtures/sass/another.css index 6399446..4b371bf 100644 --- a/test/fixtures/sass/another.css +++ b/test/fixtures/sass/another.css @@ -9,4 +9,4 @@ body { background-color: #33aa33; - background-image: url("/background.png"); } + background-image: url('/background.png'); } diff --git a/test/fixtures/sass/another.css.sassy b/test/fixtures/sass/another.css.sassy new file mode 100644 index 0000000..6399446 --- /dev/null +++ b/test/fixtures/sass/another.css.sassy @@ -0,0 +1,12 @@ +.content-navigation { + border-color: #33aa33; + color: #288728; } + +.border { + padding: 8px; + margin: 8px; + border-color: #33aa33; } + +body { + background-color: #33aa33; + background-image: url("/background.png"); } diff --git a/test/fixtures/sass/simple.min.css b/test/fixtures/sass/simple.min.css index ffb80fe..61da13e 100644 --- a/test/fixtures/sass/simple.min.css +++ b/test/fixtures/sass/simple.min.css @@ -1 +1 @@ -.content-navigation{border-color:#3bbfce;color:#2ca2af}.border{padding:8px;margin:8px;border-color:#3bbfce} +.content-navigation{border-color:#3bbfce;color:#2ca2af;}.border{padding:8px;margin:8px;border-color:#3bbfce;} diff --git a/test/fixtures/sass/simple.min.css.sassy b/test/fixtures/sass/simple.min.css.sassy new file mode 100644 index 0000000..ffb80fe --- /dev/null +++ b/test/fixtures/sass/simple.min.css.sassy @@ -0,0 +1 @@ +.content-navigation{border-color:#3bbfce;color:#2ca2af}.border{padding:8px;margin:8px;border-color:#3bbfce} diff --git a/test/fixtures/sass/simple.sass b/test/fixtures/sass/simple.sass deleted file mode 100644 index 15f87d1..0000000 --- a/test/fixtures/sass/simple.sass +++ /dev/null @@ -1,11 +0,0 @@ -$blue: #3bbfce -$margin: 16px - -.content-navigation - border-color: $blue - color: darken($blue, 9%) - -.border - padding: $margin / 2 - margin: $margin / 2 - border-color: $blue \ No newline at end of file diff --git a/test/sass.coffee b/test/sass.coffee index 0870d48..0b3eb66 100644 --- a/test/sass.coffee +++ b/test/sass.coffee @@ -19,21 +19,11 @@ describe 'a sass asset', -> response.headers['content-type'].should.equal 'text/css' body.should.equal compiled done() - - it 'should work with .sass', (done) -> - compiled = fs.readFileSync "#{__dirname}/fixtures/sass/simple.css", 'utf8' - app = express().http() - app.use new rack.SassAsset - filename: "#{__dirname}/fixtures/sass/simple.sass" - url: '/style.css' - app.listen 7076, -> - easyrequest 'http://localhost:7076/style.css', (error, response, body) -> - response.headers['content-type'].should.equal 'text/css' - body.should.equal compiled - done() it 'should work compressed', (done) -> - compiled = fs.readFileSync "#{__dirname}/fixtures/sass/simple.min.css", 'utf8' + file = "#{__dirname}/fixtures/sass/simple.min.css" + file = "#{file}.sassy" if rack.SassAsset.sassy + compiled = fs.readFileSync file, 'utf8' app = express().http() app.use new rack.SassAsset filename: "#{__dirname}/fixtures/sass/simple.scss" @@ -46,7 +36,9 @@ describe 'a sass asset', -> done() it 'should work with paths', (done) -> - compiled = fs.readFileSync "#{__dirname}/fixtures/sass/another.css", 'utf8' + file = "#{__dirname}/fixtures/sass/another.css" + file = "#{file}.sassy" if rack.SassAsset.sassy + compiled = fs.readFileSync file, 'utf8' app = express().http() app.use new rack.SassAsset filename: "#{__dirname}/fixtures/sass/another.scss" diff --git a/test/test.coffee b/test/test.coffee index 5d3a807..9b55979 100644 --- a/test/test.coffee +++ b/test/test.coffee @@ -10,6 +10,4 @@ require './dynamic' require './stylus' require './collection' require './walk' - -# Sass is commented out because it requires ruby -# require './sass' +require './sass'