Why does Grunt file aborts with message Arguments to path.join must be strings Use --force to continue

Question

I have the following grunt file I am creating for a small project I have at hand. However, it aborts withe the following message

Running "sass:dev" (sass) task
Warning: Arguments to path.join must be strings Use --force to continue.

Where am I doing wrong? Can someone explain that to me please?

/*!
 * XXX
 * @author XXXXXX
 */

'use strict';

/**
 * Grunt Module
 */

module.exports = function(grunt) {
  // Grunt goodness goes here
    /**
     * Configuration
     */
    grunt.initConfig({
        /**
         * Get package meta data
         */
        pkg: grunt.file.readJSON('package.json'),

        /**
         * Set project object
         */
        project: {
          app: 'app',
          assets: '<%= project.app %>/assets',
          src: '<%= project.assets %>/src',
          css: [
            '<%= project.src %>/styles/*.scss'
          ],
          js: [
            '<%= project.src %>/scripts/*.js'
          ],
          dist: '<%= project.assets %>/dist',
          distcss: [
            '<%= project.dist %>/styles/*.scss'
          ],
          distjs: [
            '<%= project.dist %>/scripts/*.js'
          ],
        },   

        /**
         * Project banner
         */
        tag: {
          banner: '/*!\n' +
                  ' * <%= pkg.name %>\n' +
                  ' * <%= pkg.title %>\n' +
                  ' * <%= pkg.url %>\n' +
                  ' * @author <%= pkg.author %>\n' +
                  ' * @version <%= pkg.version %>\n' +
                  ' * Copyright <%= pkg.copyright %>. <%= pkg.license %> licensed.\n' +
                  ' */\n'
        },

        /**
         * Sass
         */
        sass: {
          dev: {
            options: {
              style: 'expanded',
              banner: '<%= tag.banner %>',
              compass: true
            },
            files: {
              '<%= project.css %>': '<%= project.distcss %>'
            }
          },
          dist: {
            options: {
              style: 'compressed',
              compass: true
            },
            files: {
              '<%= project.css %>': '<%= project.distcss %>'
            }
          }
        },
        /**
         * Watch
         */
        watch: {
          sass: {
            files: '<%= project.src %>/styles/{,*/}*.{scss,sass}',
            tasks: 'sass:dev'
          }
        },
        // Uglify
        uglify: {
            options: {
              banner: '/*! <%= pkg.name %>  Version: <%= pkg.version %> Created on: <%= grunt.template.today("yyyy-mm-dd") %> */\n'
            },
            build: {
              src: 'src/scripts/*.js',
              dest: 'build/<%= pkg.name %>.min.js'
            }
        }
    });
    /**
     * Load Grunt plugins
     */
    require('matchdep').filterDev('grunt-*').forEach(grunt.loadNpmTasks);
    /**
     * Default task
     * Run `grunt` on the command line
     */
    grunt.registerTask('default', [
      'sass:dev',
      'watch'
    ]);

};

Answer 1

When specifying files for the sass task using the something.css : something.scss syntax, you cannot use asterisks to include multiple files. You either have to specify each file separately, like so:

files: {
  'one.css': 'one.scss',
  'two.css': 'two.scss',
  'three.css': 'three.scss',
}

Or, better yet, use the expand property to do it for all files in a directory, like so:

files: [{
  expand: true,
  cwd: '<%= project.src %>/styles',
  src: ['*.scss'],
  dest: '<%= project.src %>/styles',
  ext: '.css'
}]

More on that in the grunt-contrib-sass readme.