使用 Grunt 监视整个文件夹的 SASS 更改答案

【问题标题】：Watch whole folder for SASS changes with Grunt使用 Grunt 监视整个文件夹的 SASS 更改
【发布时间】：2016-11-23 09:44:22
【问题描述】：

我正在尝试查看整个文件夹的 sass 更改..

目录如下：

creatives/lp/folder/style.scss

creatives/lp/folder1/style.scss

这是我的 grunt 文件

sass: {
      dist: {
        files: {  
          'creatives/lp/**/test.css' : 'creatives/lp/**/test.scss'
        },
        options: {
          style: 'compressed',
        },
      }
    },

Grunt 能够看到 sass 的变化，但会将编译后的 CSS 写到：

创意/lp/**/style.css

CSS 应保存在与源 SCSS 文件相同的文件夹中...

【问题讨论】：

标签： sass gruntjs

【解决方案1】：

你的问题对我来说不是很清楚 - 如果你想用 grunt 将多个文件编译成一个文件，你可以将文件设为数组格式

dist: {
  files: [{
    src: ['creatives/lp/folder/*.scss'],
    dest: 'creatives/lp/folder/style.css',
  }]
}

【讨论】：

【解决方案2】：

如果你希望css文件应该和scss文件在同一个文件夹中创建，你可以使用下面的sn-p。

 sass: {                             
        dist: {                          
            options: {                       
                style: 'compressed'
            },
            files: [{
                expand: true,
                cwd: 'creatives',
                src: ['**/*.scss'],
                dest:'creatives',
                ext:'.css'
            }]
        }
    }

希望它能解决你的问题。

【讨论】：