Node-vibrant: How to use worker build with Webpack...?

Created on 8 May 2018 · 5Comments · Source: Vibrant-Colors/node-vibrant

So i'm having a rough time trying to get the worker flavour of this component working within a webpack environment.

Basically, when you import as directed in the readme.md - the result is an empty object.

import Vibrant from 'node-vibrant/dist/vibrant.worker'; 
console.log(Vibrant) // returns {}

import Vibrant from 'node-vibrant/dist/vibrant.worker.min';
console.log(Vibrant) // returns {}

// Normal import - works fine... (just doesn't seem to have the worker functionality...)
import Vibrant from 'node-vibrant';
console.log(Vibrant) /* returns ƒ Vibrant(_src, opts) {
   this._src = _src;
   this.opts = defaults({}, opts, Vibrant.DefaultOpts);
   this.opts.combinedFilter = Filters.combineFilters(this.opts.filters);
} */

Have you any ideas on how to fix?

question

Source

glomotion

👍7

Most helpful comment

Should go into your configuration for webpack.

https://webpack.js.org/concepts/loaders/ might be a good resource to find more :)

crutchcorn on 16 Apr 2019

👍2

All 5 comments

Is there a workaround for this issue?

btzr-io on 27 Jun 2018

Quoting @akfish from #85:

We are still finalizing the docs.
You will need webpack and worker-loader for this to work.
Relevant docs are in the develop branch:
https://github.com/akfish/node-vibrant/tree/develop#webpack-configuration

crutchcorn on 23 Feb 2019

🎉1 👍1

This should also have been partially caused by some bugs that were squashed in 3.1 release. Try updating the package if you're still having problems with this

crutchcorn on 23 Feb 2019

Where exactly should we add rules, it is not said. I mean in which file it will be correct to add rules?

{
  // ...
  module: {
    rules: [
      {
        test: /\.worker.js$/,
        loader: 'worker-loader',
        options: { /* ... */ }
      },
      // ...
    ]
  }
}