ES6 + jasny-bootstrap - Error: Cannot find module jasny-bootstrap?

Question

How can I import jasny-bootstrap into my ES6 class?

ES6:

'use strict';

import $ from 'jquery';
import jasny from 'jasny-bootstrap';

class PushMenu {
    constructor() {
        this.slideShown = false;
        $('.navmenu').on('shown.bs.offcanvas', () => {
            this.slideShown = true;
        });
    }
}

I get an error when I try to compile it with gulp:

{ Error: Cannot find module 'jasny-bootstrap' from '/var/www/my-project/js'

I am sure I have already installed it with npm following its npm page:

npm install jasny-bootstrap

Any ideas why and how to resolve this?

EDIT:

I managed to load it manually with the full path:

import jasny from '../node_modules/jasny-bootstrap/dist/js/jasny-bootstrap';

But it does not work with no error hinted.

EDIT 2:

I have tried to glue it with:

jQueryBridget('jasny', Jasny, $);

but still no luck. Error:

Uncaught TypeError: Cannot read property 'option' of undefined

The entire code:

'use strict';

import $ from 'jquery';
import bootstrap from 'bootstrap';
import Jasny from '../node_modules/jasny-bootstrap/dist/js/jasny-bootstrap.js';
import jQueryBridget from 'jquery-bridget';

jQueryBridget('jasny', Jasny, $);

class PushMenu {
    constructor() {
        this.slideShown = false;
        $('.navmenu').on('shown.bs.offcanvas', () => {
            this.slideShown = true;
        });
    }
}

does it truly exist if you go into that folder? What if you declared the full path in the import? `import jasny from '/full-path'` — Eric G, Oct 10 '16 at 04:16
`does it truly exist if you go into that folder?` yes it is in the `node_modules` folder. — Run, Oct 10 '16 at 04:24
After the other question about masonry you now must understand that just importing a dependency does not make it automatically work with the instance of jquery. There should be some glue layer between the two. PS: nope, I don't know it, I never worked with either jasny or masonry. There is a chance no one implemented it yet - so it's your chance to contribute into the opensource :-) — zerkms, Oct 10 '16 at 04:44
@zerkms I have tried to glue it with `jQueryBridget('jasny', Jasny, $);` but still no luck. — Run, Oct 10 '16 at 04:54
Not sure what `Jasny` refers to, there is no such variable in your code. Provide the **complete** code for your last attempt. Also, I'm not aware on how all these libraries work internally, there is a chance the `jasny` is simply not compatible with `jQueryBridget`. In that case you need help from `jasny` developers or make it compatible yourself. — zerkms, Oct 10 '16 at 04:56
@zerkms I have updated my edit. It might have to be glued to bootstrap not to jquery. — Run, Oct 10 '16 at 05:01

score 0 · Answer 1 · answered Oct 10 '16 at 06:30

It does not work with ES6 import but works with:

<script src="vendor/jasny-bootstrap/jasny-bootstrap.js"></script>

Then without importing it:

class PushMenu {
    constructor() {
        this.slideShown = false;
        $('.navmenu').on('shown.bs.offcanvas', () => {
            this.slideShown = true;
        });
    }
}

Not ideal.

ES6 + jasny-bootstrap - Error: Cannot find module jasny-bootstrap?

1 Answers1