JS, Browserify: function not defined

Question

I have files as represented:

-js/
    - calc.js
    - tool.js
-index.html

calc.js is a node module of following structure:

module.exports = {
   calculate: function() {...},
   getPrecision: function() {...}
}

and tool.js use require and adds some functions, like that:

const fpcalc = require('./fpcalc');

function changeState() {
//some code using fpcalc
}

I used Browserify to generate bundle.js and added that as script src. One of my buttons on HTML page is using onclick=changeState(). After clicking I'm getting

ReferenceError: changeState is not defined
at HTMLAnchorElement.onclick

Why is that? Is there any other way to make it work?

Answer 1

The function "changeState" is not exported in your tool.js. That means it is only visible inside your bundle.js, but not outside.

Have a look at this: https://makerlog.org/posts/creating-js-library-builds-with-browserify-and-other-npm-modules

It shows you how to expose your code to the global namespace in javascript.