Initial setup for grunt-sass

Gruntfile.js

@@ -19,9 +19,9 @@ module.exports = function (grunt) {
         tasks: ['emberTemplates:dev']
       },
 
-      compass: {
-        files: 'app/styles//**/*.{sass,scss}',
-        tasks: ['compass:dev']
+      sass: {
+        files: 'app/styles/**/*.{sass,scss}',
+        tasks: ['sass:dev']
       },
 
       html: {
@@ -45,31 +45,44 @@ module.exports = function (grunt) {
       dev: '.tmp'
     },
 
-    compass: {
+    sass: {
       options: {
-        bundleExec: true
+        includePaths: ['app/styles/**/*.sass'],
+        sourceMap: true,
+        imagesPath: '' // Prepended to generated image URL
       },
       dev: {
+        files: {
+          '.tmp/styles/app.css': 'app/styles/app.sass'
+        },
         options: {
-          sassDir: 'app/styles',
-          cssDir: '.tmp/styles',
-          fontsDir: 'app/fonts',
-          httpFontsDir: 'fonts',
-          imagesDir: 'app/images'
+          outputStyle: 'nested'
         }
       },
       dist: {
+        files: {
+          'dist/styles/app.css': 'app/styles/app.sass'
+        },
         options: {
-          sassDir: 'app/styles',
-          cssDir: '.tmp/styles',
-          fontsDir: 'dist/fonts',
-          httpFontsDir: 'fonts',
-          imagesDir: 'app/images',
-          environment: 'production'
+          outputStyle: 'compressed'
         }
       }
     },
 
+    autoprefixer: {
+      options: {
+        browsers: 'last 2 versions'
+      },
+      env: {
+        src: '.tmp/styles/app.css',
+        dest: '.tmp/styles/app.css'
+      },
+      dist: {
+        src: 'dist/styles/app.css',
+        dest: 'dist/styles/app.css'
+      }
+    },
+
     // Compiles Handlebar templates to a single JS file
     emberTemplates: {
       options: {
@@ -154,12 +167,12 @@ module.exports = function (grunt) {
     // Run some tasks in parallel to speed up the build process
     concurrent: {
       dev: [
-        'compass:dev',
+        'sass:dev',
         'emberTemplates:dev'
       ],
 
       dist: [
-        'compass:dist',
+        'sass:dist',
         'emberTemplates:dist'
       ]
     },
@@ -202,6 +215,7 @@ module.exports = function (grunt) {
       'env:dev',
       'preprocess:dev',
       'concurrent:dev',
+      // 'autoprefixer:dev',
       'server:dev',
       'watch'
     ]);
@@ -212,6 +226,7 @@ module.exports = function (grunt) {
     'preprocess:dist',
     'useminPrepare',
     'concurrent:dist',
+    // 'autoprefixer:dist',
     'concat',
     'copy:dist',
     'cssmin',

app/styles/app.sass

@@ -1,5 +1,5 @@
-@import compass/reset
-@import compass/css3
+// @import compass/reset
+// @import compass/css3
 
 @import base/variables
 @import base/mixins
@@ -14,4 +14,3 @@
 @import layout/header
 @import layout/footer
 @import layout/media
-

package.json

@@ -13,11 +13,11 @@
   "author": "Szymon Nowak",
   "license": "MIT",
   "dependencies": {
-    "express": "~3.4.7",
-    "express-persona": "~0.1.1",
-    "node-uuid": "~1.4.1",
-    "firebase-token-generator": "^0.1.4",
-    "newrelic": "^1.4.0",
+    "express": "~3.18.6",
+    "express-persona": "~0.1.2",
+    "node-uuid": "~1.4.2",
+    "firebase-token-generator": "~2.0.0",
+    "newrelic": "~1.14.3",
 
     "grunt": "~0.4.2",
     "grunt-cli": "~0.1.9",
@@ -29,13 +29,15 @@
     "grunt-contrib-uglify": "~0.3.2",
     "grunt-contrib-copy": "~0.5.0",
     "grunt-contrib-cssmin": "~0.7.0",
-    "grunt-ember-templates": "~0.4.18",
     "grunt-usemin": "~2.0.2",
     "grunt-concurrent": "~0.4.3",
     "grunt-contrib-compass": "~0.7.1",
     "grunt-env": "~0.4.1",
     "grunt-preprocess": "^4.0.0",
-    "grunt-rev": "^0.1.0"
+    "grunt-rev": "^0.1.0",
+    "grunt-ember-templates": "~0.4.23",
+    "grunt-sass": "~0.17.0",
+    "grunt-autoprefixer": "~2.0.0"
   },
   "engines": {
     "node": "~0.10.0"