The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums JavaScript How could grunt compile all of my scss files to css?

  • This topic is empty.
Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
  • #252318

    I’ve started to learn this just now. I installed the grunt. If I get grunt watch it is automatic but only in case one file. How could I make it wath all scss file in my theme, and make the css in different folders. I don’t really undestand how could it working in big.

    This is my gruntfile.js now:

    module.exports = function(grunt) {
     // Project configuration.
       pkg: grunt.file.readJSON('package.json'),
        connect: {
         uses_defaults: {}
        sass: {
         dev: {
           options: { sourceMap: true },
           files: { 'sites/all/themes/uj/css/uj.styles.css' : 'sites/all/themes/uj/sass/uj.styles.scss' }     
       watch: {
        css: {
          files: 'sites/all/themes/uj/**/*.scss',
          tasks: [ 'sass:dev' ],
          options: { livereload: true }
     // Load Grunt plugins
    // grunt.loadNpmTasks('');
     // Default task(s).
     grunt.registerTask('default', []);
    // Load Grunt plugins

    Hi Ayala!

    It looks like the sass:dev task is only targeting one file (sites/all/themes/uj/sass/uj.styles.scss). Try using a globbing pattern to target multiple files.

    Also, I’ve usually found it necessary to set the cwd (current working directory, I think) when working with multiple files. Something like this might work; it’s untested, so it might need some tweaking:

    sass: {
      dev: {
        options: { sourceMap: true },
        files: [{
          expand: true,
          cwd: 'sites/all/themes/uj/',
          src: ['sass/*.scss'],
          dest: 'css/',
          extDot: 'last'  // Extensions in filenames begin after this dot

    Thank you for your answer.
    Now it notice that what file changed, but it doesn’t change the css file.
    If i create a new scss, it is noticed.

    Completed in 0.593s at Tue Mar 21 2017 11:03:30 GMT+0100 (CET) - Waiting...
    >> File "sites/all/themes/tarsoly/sass/teszt.scss" changed.
    Running "sass:dev" (sass) task

    But it doesn’t generate a css file.

Viewing 3 posts - 1 through 3 (of 3 total)
  • The forum ‘JavaScript’ is closed to new topics and replies.