CODEWITHSUNDEEP
reactjsnamespacesbrowserifybabeljs
Nishanth Matha
Nishanth Matha

Reputation: 6081

browserify and babel namespace error React

New to browserify: I have a normal js file with some react components grouped in a namespace like:

var myNameSpace= {
'reactFunc1': React....,
'reactFunc2': React....,
'reactFunc3': React....,
'nonreactFunc1' function(..)
}

And in some other js file I'm trying to use:

myNameSpace.reactFunc1(...);

this works fine when I tranform jsx to js using babel.

But when I browerify the files using the command browserify -t [ babelify --presets [ react ] ] some.js someOther.js

myNameSpace not defined

What I'm doing wrong here. Is there any way to get this working without much hastle / code change?

Upvotes: 0

Views: 97

Answers (1)

Tzach
Tzach

Reputation: 13406

You have two options here, using modules or using the global namespace.

When using modules, you will need to export the namespace from the first module and require it in the other module:

module.exports = {
    'reactFunc1': React....,
}

Then in the other file

var myNameSpace = require('first_module');

The other option (less preferred) is to use the global window object:

window.myNameSpace = {
    'reactFunc1': React....,
}

Then in the other file:

window.myNameSpace.reactFunc1()

Upvotes: 2

Related Questions