How to import/require existing Non-React-Native-Component JS to a React Native Component

Question

I have a pretty big javascript legacy code base of a WebApplication, which includes the presentation/data model/controller/connectivity. I'm trying to replace the presentation layer technology with ReactNative, while keep the existing data model/controller/connectivity parts. So the first question is, after I built the ReactNativeComponent where we have the UI layout defined, binding established, styles created... but I need to call some js functions from the legacy code. How can I require/import an existing js file (not a ReactNativeComponent) to one ReactNativeComponent and use it?

iamjpg · Accepted Answer · 2017-03-09 22:56:36Z

2

I've had this problem before too. Something I did, unable to find more elegant solutions, was to wrap my legacy code in a module.

Let's say this is foo.js

var Foo = (function() {
  var mod = {
    init: function() {
      // legacy code here...
    }
  }

  return mod;
})()

module.exports = Foo;

then in calling file:

import foo from './somewhere/foo';
foo.init();

I didn't love this approach, but it worked. Hopefully it can somewhat help.

answered Mar 9, 2017 at 22:56

iamjpg

7,6281 gold badge19 silver badges18 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Matt Aft · Accepted Answer · 2017-03-09 22:45:18Z

1

If they're purely js then you can import them normally. If they have anything to do with html/css/dom it will throw an error.

answered Mar 9, 2017 at 22:45

Matt Aft

8,9663 gold badges28 silver badges38 bronze badges

Collectives™ on Stack Overflow

How to import/require existing Non-React-Native-Component JS to a React Native Component

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related