Support Sass Loader

Author: 尹曰

lib/build.js

@@ -131,9 +131,14 @@ function getWebpackOpts(opts, callback) {
   css = spmcss + css;
   var cssLoader = 'style!' + css;
   var lessLoader = 'style!' + normalize(css+'!less', opts, 'less');
+
+  var sassOutputStyle = opts.build.sass && opts.build.sass.outputStyle || 'expanded';
+  var sassLoader = 'style!' + normalize(css+'!resolve-url!sass?sourceMap&outputStyle='+sassOutputStyle, opts, 'scss');
+
   if (opts.build.extractCSS || files.extractCSS) {
     cssLoader = ExtractTextPlugin.extract('style', css);
     lessLoader = ExtractTextPlugin.extract('style', normalize(css+'!less', opts, 'less'));
+    sassLoader = ExtractTextPlugin.extract('style', normalize(css+'!resolve-url!sass?sourceMap&outputStyle='+sassOutputStyle, opts, 'scss'));
   }
 
   var babelOpts = decodeURI(qs.stringify(opts.build.babel, {arrayFormat:'brackets'}));
@@ -174,6 +179,7 @@ function getWebpackOpts(opts, callback) {
         { test: /\.handlebars$/, loader: normalize('handlebars?helperDirs[]=' + __dirname + '/../helpers', opts, 'handlebars') },
         { test: /\.css$/, loader: cssLoader },
         { test: /\.less$/, loader: lessLoader },
+        { test: /\.scss$/, loader: sassLoader },
         { test: /\.(png|jpe?g|gif|eot|svg|ttf|woff|woff2)$/, loader: loader }
       ]
     },

lib/getFiles.js

@@ -74,9 +74,9 @@ function map(files, cwd, pathmap) {
       key = file.name.replace(new RegExp(ext + '$'), '');
       key = formatOutputPath(key, pathmap);
       js[key] = formatFiles(file.files, cwd);
-    } else if (ext === '.css' || ext === '.less') {
+    } else if (ext === '.css' || ext === '.less' || ext === '.scss') {
       // Create js file to require css
-      var f = file.name.replace(/\.(css|less)$/, '');
+      var f = file.name.replace(/\.(css|less|scss)$/, '');
       f = formatOutputPath(f, pathmap);
       var fileName = '_webpackcssentry_' + f;
       var jsFile = join(require('os').tmpdir(), fileName + '.js');

package.json

@@ -32,7 +32,9 @@
     "mkdirp": "~0.5.1",
     "node-libs-browser": "~0.5.2",
     "qs": "~2.4.1",
+    "resolve-url-loader": "~1.2.0",
     "rimraf": "~2.3.2",
+    "sass-loader": "~2.0.1",
     "scripts-hook": "~0.1.3",
     "semver": "~4.3.1",
     "spm-argv": "~0.1.0",