jackfranklin / gulp-load-plugins

Automatically load in gulp plugins
https://github.com/jackfranklin/gulp-load-plugins
MIT License
757 stars 55 forks source link

How do I find out correct plugin names #132

Closed brian-lamb-software-engineer closed 5 years ago

brian-lamb-software-engineer commented 6 years ago

I am trying to understand better, not seeing it documented anywhere, how to access plugins that have unbeknownst names. In this case i decided to swap out gulp-uglify with gulp-uglify-es.

I tried many combinations of patters, and renames, but i can not access it via plugins yet.

It finally occurred to me that when i first set this up I learned that I can just console.log the entire plugins object, to see the Getter names.

$ gulp js-build --production
{ browserify: [Getter],
  cleanCss: [Getter],
  concat: [Getter],
  order: [Getter],
  rename: [Getter],
  sass: [Getter],
  sourcemaps: [Getter],
  uglifyEs: [Getter],
  util: [Getter],
  browserSync: [Getter],
  browserSyncWebpackPlugin: [Getter],
  del: [Getter] }
...
[11:45:32] TypeError: plugins.uglifyEs is not a function

So I did that this time, and I see the names, but that's not helping either.

Here is my Plugin config

var plugins = require('gulp-load-plugins')({
  overridePattern: false,
  pattern: ['browser-*', 'del'],
  rename: {
    'uglifyEs': 'uglify'
  },
});

Why cant i specify it that way in the rename portion, or what did I miss? Could it have something to do with initializing it imporoperly? I see on the readme it shows using .default, not sure if that has anything to do with it.

Mind you, this wasnt the only case I struggled with this, there was a bit of homework needed on this one as well

var plugins = require('gulp-load-plugins')({
  overridePattern: false,
  pattern: ['browser-*', 'del', 'babel*', 'vueify', 'ugli*', 'event-stream',
      'vinyl-*'],
  rename: {
    'vinyl-source-stream': 'source'
  },
});
brian-lamb-software-engineer commented 6 years ago

I determined/hoped that when I printed out uglifyEs { default: [Function: plugin] } the fact that it was not undefined It was atleast the valid name, then when i tried printing out uglifyEs() it yielded TypeError: plugins.uglifyEs is not a function. So, That led me to the clue that maybe I did need the default portion after all, so i printed out uglifyEs.default it came back as [Function: plugin] which clued me in to try it in my task like this plugins.uglifyEs.default() This did the trick!!

So, am I on the right track to finding the correct object names, or is there a better way?

One question remains, why isnt rename working?


 rename: {
    'uglifyEs': 'uglify'
  },
`

Do I need to have this plugin also specified in `pattern` for this to work, or what?
jameelmoses commented 5 years ago

According to the docs for gulp-uglify-es, you are correct that you need to invoke the .default() method. This is part of the declaration for the plugin.

You're also correct that you need to add it to the pattern key in the options object. This is what lets the plugin know what globs to search for.