使用load-grunt-config找不到Grunt插件

Question

I've split out my grunt plugins into their own files and I'm using the load-grunt-config ( https://github.com/firstandthird/load-grunt-config ) to call them:

module.exports = function (grunt) {

  'use strict';

  require('load-grunt-config')(grunt);
}; 

I've got sass, autoprefixer, cssmin and watch tasks working but I'm also using Browsersync and px-to-rem these two plugins return:

Warning: Task "remify" not found. Use --force to continue.

and

Warning: Task "browsersync" not found. Use --force to continue.

when called individually or as part of a bigger task.

I've followed the syntax for the separate.js files for these two plugin so I'm at a loss. For example the remify.js file which is called when running grunt is written like this

module.exports = {
  dist: {
    options: {
      base: 16,
      fallback: true,
      fallback_existing_rem: true,
      ignore: []
    },
    files: {
      'css/style.css': 'css/style.css'
    }
  }
};

Any ideas where this is going wrong?

I've also set up a gist of the example code, include package.json and a aliases.yml

https://gist.github.com/sturobson/f88258fd010e901e24d9

Answer 1

You have to call the grunt plugin exactly what it is. So where I've got remify I should be using px_to_rem and where I've got browsersync and I should have browserSync .

Silly me.

Answer 2

you can pass a second argument to load-grunt-config to provide some options where you could also define some pattern which can be used by load-grunt-tasks which is used internally.

if you don't pass a second argument, it uses the default-pattern of load-grunt-tasks which is grunt-* .

so if you want to load all devDependencies without defining them seperatly, do it like this:

require('load-grunt-config')(grunt, {
    loadGruntTasks: {
        pattern: '*',
        scope: 'devDependencies'
    }
});