Grunt Connect Server CSS files are blank

Question

I am using a Grunt connect web server to serve JS and CSS files locally.

Grunt-contrib-connect: https://github.com/gruntjs/grunt-contrib-connect

The Grunt task looks like the following:

connect: {
    server: {
        options: {
            port: 9001,
            base: '<%= templateDir %>/interface/build/',
            livereload: true,
            debug: true
        }
    }
}

It servers JS files correctly, but all the CSS files served are empty.

The following are the local URLs being used to access the files:

JS URL: http://localhost:9001/production.js

CSS URL: http://localhost:9001/production.css

Any assistance or thoughts is greatly appreciated!

Answer 1

Turns out the templateDir config variable was not empty, but did not result in an error. Thing that threw me was the mapped to directory actually existed with files of the exact same name.

Solution was to pass in the variable when registering the task:

grunt.registerTask('serve', [
    'set_config:templateDir:<%= pkg.templateDir %>',
    'connect',
    'watch'
]);