CODEWITHSUNDEEP
javascriptgruntjsgrunt-contrib-watch
Sheba
Sheba

Reputation: 736

How to I create a top-level grunt file and import it in another grunt file located in subfolders?

I want to create a common top-level Gruntfile.js configured to watch over less file change. When the less file changes, I want to compile it to css and then livereload the css file in browser. I have the functionality working but I have to duplicate most of code in Gruntfile.js for every project. So I was thinking if there is some way I can create a common Gruntfile.js and include/import it in different projects.

module.exports = function (grunt) {
'use strict';

grunt.initConfig({
  pkg: grunt.file.readJSON('package.json'),

  less: {
    options: {
      compress: true
    },
    compile: {
      extend: true,
      src: 'less/**/project.less',
      dest: 'css/project.css',
      ext: '.css'
    }
  },

  watch : {
    less : {
      files : ['less/**/*.less'],
      tasks : ['less']
    },
    css : {
      files : ['css/*.css'],
      options : {
        livereload: true,
        spawn : false
      }
    }
  }
  });

  grunt.loadNpmTasks('grunt-contrib-watch');
  grunt.loadNpmTasks('grunt-contrib-less');
};

Upvotes: 3

Views: 886

Answers (1)

Sheba
Sheba

Reputation: 736

I solved the problem using grunt plugin - 'gruntfile'. It lets you import top-level Gruntfile.js to be included in other Gruntfiles. I set parameters dynamically of parent Gruntfile from within other gruntfiles.

You can find more about the plugin and usage examples on : https://github.com/shama/gruntfile

Upvotes: 3

Related Questions