javascript - grunt watch 不编译所有 sass 文件,尽管是 "watched"

标签 javascript gruntjs grunt-contrib-watch

基本上目前我有两个问题似乎无法找到答案。 当我保存主 styles.scss 时,sass 编译正常,但是当我保存 _globals.scss 或任何其他 scss 文件时,grunt watch 似乎检测到更改,但是它无法编译!我需要做什么来纠正这个问题?

我的第二个问题是当我在 scss 文件夹中的目录中有一个 scss 文件时,例如:pages/_gallery.scss(正在主 styles.scss 中导入) ),grunt watch 没有看到它,我知道这可能是因为我的 cwd 路径,但我如何使其更通用?

这是我的 Gruntfile.js:

module.exports = function(grunt) {

  // Project configuration.
  grunt.initConfig({

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

    watch: {
      scripts: {
        files: ['public/resources/site/js/*.js'],
        tasks: ['newer:jshint', 'newer:uglify:dist'],
        options: {
          spawn: false,
          livereload: true,
        },
      },
      sass: {
        files: ['public/resources/site/scss/*.scss'],
        tasks: ['newer:sass:app'],
        options: {
          livereload: true
        }
      },
      php:{
          files: ['public/index.php'],
          options: {
            livereload: true
          }
      }
    },
    sass: {
      app: {
        files: [{
          expand: true,
          cwd: 'public/resources/site/scss/',
          src: ['*.scss'],
          dest: 'public/resources/site/css/',
          ext: '.css'
        }]
      },
      options: {
        sourceMap: true,
        outputStyle: 'compressed'
      }
    },
    uglify: {
      dist: {
        options: {
          sourceMap: true,
          mangle: true
        },
        files: [{
          expand: true,
          cwd: 'public/resources/site/js/',
          src: ['*.js'],
          dest: 'public/resources/site/js/',
          ext: '.min.js'
        }]
      }
    },
    jshint: {
      options: {
        force: true
      },
      files: [
          'public/resources/site/js/*.js',
          '!public/resources/site/js/*.min.js'
      ]
    },
    notify: {
      watch: {
        options: {
          title: 'Tasks Complete',
          message: 'Files Processed & Compiled',
        }
      }
    }
  });

  // Load tasks
  grunt.loadNpmTasks('grunt-contrib-watch');
  grunt.loadNpmTasks('grunt-contrib-jshint');
  grunt.loadNpmTasks('grunt-contrib-uglify');
  grunt.loadNpmTasks('grunt-contrib-imagemin');
  grunt.loadNpmTasks('grunt-newer');
  grunt.loadNpmTasks('grunt-sass');
  grunt.loadNpmTasks('grunt-notify');

  // Default task(s).
  grunt.registerTask('default', []);

  grunt.task.run('notify_hooks');

};

最佳答案

要使子目录正常工作,您需要 globbing pattern ;

'public/resources/site/scss/**/*.scss'

我认为您的监视任务由于较新而存在缺陷。 Watch 检测到 _globals 的更改,但 sass 任务只知道编译主 styles.scss。但是,newer 发现该文件没有更改,因此它不会运行该步骤。

尝试从监视任务列表中删除较新

关于javascript - grunt watch 不编译所有 sass 文件,尽管是 "watched",我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33647469/

相关文章:

javascript - 创建嵌套数据(JSON 或数组)

javascript - IE 7 中 div 内容丢失换行符

node.js - Grunt.js : Fire livereload as soon a files are modified, 任务完成前

javascript - 检测 vagrant guest 机器中的文件更改

javascript - 如何删除 ""(空字符串)的 JSON 元素?

javascript - 如何将pace与ember cli应用程序一起使用

javascript - Grunt Watch 任务不触发 Uglify 任务

javascript - Visual Studio 2015 中的 Grunt watch 任务绑定(bind)

wordpress - 加快Vagrant上主机和 guest 之间的同步延迟(NFS同步文件夹)

macos - 默认情况下使用命令打开 iTerm/Terminal。