grunt watch and stylus

2019-07-06 00:53发布

问题:

can't figure how nesting grunt watch and stylus compiler (livereload will come later)

I tried also using the "new" grunt newer, but there must be something wrong in my code.

Any suggestion?

grunt.initConfig({

  stylus: {
    compile: {
      options: {
        paths: ['stylus'],

        import: [      
          'nib/*'
        ]
      },
      files: {
        'css/style.css': 'stylus/style.styl', 
      },
    },

  },
  watch: {
    stylus: {
      files: ['*/*.*'],
      task: ['newer:stylus:compile'],
      options : { livereload: true },
    },
  },

});


grunt.loadNpmTasks('grunt-contrib-stylus');
grunt.loadNpmTasks('grunt-contrib-watch');
grunt.loadNpmTasks('grunt-newer');

grunt.registerTask('compile', ['newer:stylus:all']);

Also, if i run grunt watch, it works good but do nothing. And, if i run grunt stylus, it compile my css perfectly.

回答1:

Well, in your original code you are using the option task when it should be tasks (plural). That would be my first guess.

watch: {
  stylus: {
    files: ['*/*.*'],
    tasks: ['stylus:compile'],   // This needs to be "tasks" (not "task")
    options : { livereload: true },
  },
},

I also don't think you need the newer bit in front.



回答2:

I solved by myself, but i can't figure what was the error.

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

        stylus: {
            all: {
                options: {
                      paths: ['stylus'],

                      import: [      //  @import 'foo', 'bar/moo', etc. into every .styl file
                        'nib/*'
                      ]
                    },
                    files: {
                      'css/style.css': 'stylus/style.styl', // 1:1 compile
                    },
            },
        },

        watch: {
            files: [
                'stylus/*.styl',
            ],
            tasks: ['stylus:all'],
        }
      });