CODEWITHSUNDEEP
javascriptgoogle-chrome-extensionbrowserifycommonjs
Yan Yi
Yan Yi

Reputation: 773

browserify circular dependency: something is not a function

I've recently started writing CommonJS modules but facing issues in requiring modules. Why is storage.js unable to reach the example module which I have required? What is the proper way to require a dependent module in this case?

EDIT: Included more information because the previous question omitted hello.js, which I thought wasn't the cause of the problem. Seems like including it causes a uncaught type error. Also, this is part of the code for a chrome extension, and main.js is the content script.

// main.js
var hello = require('./hello');
var storage = require('./storage');
var example = require('./example');

storage.store(); 

// storage.js
var example = require('./example');
module.exports = (function() {

    function store() {example.ex();}

    return {store: store};

})();

// example.js
var storage = require('./storage');

module.exports = (function() {
    function ex() {
         console.log('example');
    }    
    return {ex: ex};    
})();

// hello.js
var example = require('./example'); // <<<< Including this gives Uncaught TypeError: example.ex is not a function
module.exports = (function() {
    function hello() {
        console.log('hello');
    }

    return {hello:hello};
})();

Upvotes: 3

Views: 1870

Answers (1)

David Souther
David Souther

Reputation: 8174

Not a direct answer to your question, but Browserify will wrap in a self-invoking function for you. You can simplify your lib files:

// main.js
var storage = require('./storage');
storage.store();

Because you don't use hello or example, don't require them.

// storage.js
var example = require('./example');
function store() {example.ex();}
module.exports.store = store;

No need to go through the self-invoking function here.

// example.js
module.exports.ex = ex;
function ex() {
    console.log('Example');
}

This doesn't use storage, so don't include it.

hello.js does nothing but trigger the circular dependency, remove it.

In your updated code, you have a circular dependency between storage.js and example.js. Because you don't use anything from storage in example, you can just remove that require. I still think you should remove the self-invoking functions, as that's already part of commonjs.

When loading a module, Commonjs will only execute the file a single time. Everything on module.exports is then cached for future calls. When you include the circular dependency for the first time, the module loader sees that its currently being loaded, and you don't get any results back. Subsequent calls will complete as normal.

Upvotes: 2

Related Questions