CODEWITHSUNDEEP
javascriptdependenciesbrowserifyrequire
rpeg
rpeg

Reputation: 228

Reference error probably due to dependency issue in Javascript using require()

I am using browserify in gulp in order to use the require() function. From there I am attempting to load a JS library using require before a script that refers to an object from the library.

require('tippy.js');

new Tippy(".tippy", {
    position: 'right',
    animation: 'scale',
    duration: 1000,
    arrow: true
});

When compiled and loaded in the browser I get this reference error:

Uncaught ReferenceError: Tippy is not defined

I'm assuming it's a dependency issue. Suggestions?

Upvotes: 0

Views: 1539

Answers (2)

user5650295
user5650295

Reputation:

you should append it to Window variable like this :

window.Tippy = require('tippy.js').default;

then yo can use 

Tippy(".tippy", {
position: 'right',
animation: 'scale',
duration: 1000,
arrow: true })

Upvotes: 0

Joseph
Joseph

Reputation: 119887

Did you mean:

var Tippy = require('tippy.js');

Also, given that you're using a module system, I would suggest against relying on globals. Tippy is bundled as a UMD module. It's packaged to detect the module system used by the environment and export the library accordingly. Since browserify is CJS, a UMD-bundled module returns a reference to the library's export from require and not load it to the global scope.

Upvotes: 1

Related Questions