1

in my Drupal 8 project I have custom modules where inside each of theme I have two directories scss and css, so that the structure is like:

- modules
  - custom
    - my_module_1
      - scss
      - css
    - my_module_2
      - scss
      - css
- themes
  - my_theme
    - Gruntfile.js

in my Gruntfile.js I want to tell sass to go through each custom module and run on the scss folder as source and the css folder should be the destination.

so far I have a task like the following:

  sass: {
    prod:{
      options: {
        sourceMap: false,
        outputStyle: 'compressed',
        includePaths: ['scss']
      },
      files: {
        '../../modules/custom/my_module_1/css/file1.css': '../../modules/custom/my_module_1/scss/file1.scss',
        '../../modules/custom/my_module_1/css/file2.css': '../../modules/custom/my_module_1/scss/file2.scss',
        '../../modules/custom/my_module_2/css/file1.css': '../../modules/custom/my_module_2/scss/file1.scss'
      }
    }
  }

as you can see it's redundant, how can make it cleaner in one generic command (maybe with wildcards but i couldn't figure that out yet)

Thanks.

ashraf aaref
  • 189
  • 2
  • 10
  • have you tried something like: `'../../modules/custom/*/css/*.css': '../../modules/custom/*/scss/*.scss',` I don't know it too well, but I know an asterisk is wildcard in grunt. – Ronnie Nov 10 '16 at 23:52

1 Answers1

1

Just in case someone is looking for same answer in future.

I have ended up solving it with expand the following way:

sass: {
  prod:{
    options: {
      sourceMap: false,
      outputStyle: 'compressed',
      includePaths: ['scss']
    },
    files: {
      expand: true,
      src: ['../../modules/custom/*/scss/*.scss'],
      dest: '/css',
      rename: function(dest, src){
        var fname = src.substring(src.lastIndexOf('/'),src.lastIndexOf('.'));
        return src.substring(0, src.lastIndexOf('/scss')) + dest + fname + '.css';
      },
      ext: '.css'
    }
  }
}
Community
  • 1
  • 1
ashraf aaref
  • 189
  • 2
  • 10