Missing / broken stringify dependency

[falloutghost]

• Vue.js version: 1.0.16
• consumed using: browserify
• FULL error message (including stack trace):

Browserify Failed!: Cannot find module 'stringify' from '/home/<hidden>/www/app/node_modules/vue-tables'
{ [Error: Cannot find module 'stringify' from '/home/<hidden>/www/app/node_modules/vue-tables']
  stream: 
   Labeled {
     _readableState: 
      ReadableState {
        highWaterMark: 16,
        buffer: [],
        length: 0,
        pipes: [Object],
        pipesCount: 1,
        flowing: true,
        ended: false,
        endEmitted: false,
        reading: true,
        sync: false,
        needReadable: true,
        emittedReadable: false,
        readableListening: false,
        objectMode: true,
        defaultEncoding: 'utf8',
        ranOut: false,
        awaitDrain: 0,
        readingMore: false,
        decoder: null,
        encoding: null,
        resumeScheduled: false },
     readable: true,
     domain: null,
     _events: 
      { end: [Object],
        error: [Object],
        data: [Function: ondata],
        _mutate: [Object] },
     _eventsCount: 4,
     _maxListeners: undefined,
     _writableState: 
      WritableState {
        highWaterMark: 16,
        objectMode: true,
        needDrain: false,
        ending: true,
        ended: true,
        finished: true,
        decodeStrings: true,
        defaultEncoding: 'utf8',
        length: 0,
        writing: false,
        corked: 0,
        sync: false,
        bufferProcessing: false,
        onwrite: [Function],
        writecb: null,
        writelen: 0,
        buffer: [],
        pendingcb: 0,
        prefinished: true,
        errorEmitted: false },
     writable: true,
     allowHalfOpen: true,
     _options: { objectMode: true },
     _wrapOptions: { objectMode: true },
     _streams: [ [Object] ],
     length: 1,
     label: 'deps' } }

• relevant code:
  Vue.use(require('vue-tables'));
• steps for reproducing the issue:
  • Fetch vue-tables via npm: npm install vue-tables --save
  • Run browserify (chained through gulp)

I'm trying to use vue-tables in a current project, however, after installing the plugin via npm, the above error occurs (short: Browserify Failed!: Cannot find module 'stringify' from '/home/<hidden>/www/app/node_modules/vue-tables').

Installing stringify manually (npm install stringify --save) resolves the issue, but then breaks my Vue app completely (error: TypeError: plugin.apply is not a function).

[falloutghost]

Apparently Vue fails to instantiate the plugin, this is where the TypeError: plugin.apply is not a function error happens:

Vue.use = function (plugin) {
    /* istanbul ignore if */
    if (plugin.installed) {
      return;
    }
    // additional parameters
    var args = toArray(arguments, 1);
    args.unshift(this);
    if (typeof plugin.install === 'function') {
      plugin.install.apply(plugin, args);
    } else {
      plugin.apply(null, args);
    }
    plugin.installed = true;
    return this;
  };

Maybe I'm registering it wrong?

[falloutghost]

Having a look at the fiddle (https://jsfiddle.net/matfish2/f5h8xwgn/) helped, I missed the .client part:

var VueTables = require('vue-tables');
Vue.use(VueTables.client);

Sorry.

[EmilMoe]

I have same problem

[matfish2]

Did you read the comments of @falloutghost?

[gbdematos]

+1 Same exact problem... I read the comments of @falloutghost, but didn't work.

var VueTables = require('vue-tables'); Vue.use(VueTables.client);

Still, same error:

[16:25:52] gulp-notify: [Laravel Elixir] Browserify Failed!: Cannot find module 'stringify' from 'S:\host\node_modules\vue-tables'

[matfish2]

I am using elixir myself with no issues.
You need to (a) install stringify and (b) tell elixir to use it
Taken from my gulp file:
mix.browserify(['../test.js'],'public/test.min.js', null, {transform: 'stringify'});

[nateritter]

I know this is old, but FWIW, I'm using Laravel Spark (v2) and found this to work:

yarn add stringify (or npm install stringify)
yarn add vue-tables

Then in /resources/assets/js/app.js register like so:

import VueTables from 'vue-tables';
Vue.use(VueTables.client);

And finally in the gulpfile.js be sure to add the transform into browserify...

elixir(function(mix) {
  mix.less('app.less')
...
  .browserify('app.js', null, null, {transform: 'stringify'})
...
});

YMMV