frostney / react-native-create-library

:notebook: Command line tool to create a React Native library with a single command
MIT License
1.45k stars 113 forks source link

Not linking with newer versions of react-native. #27

Closed pgarciacamou closed 7 years ago

pgarciacamou commented 7 years ago

Using:

I did the following:

  1. react-native-create-library Lib.
  2. react-native init RNLibTest.
  3. "Successfully linking" (doesn't look like it) with both automated (react-native link) and manual way: both following the scaffolded instructions of this repo AND following the linking section of react-native docs.

The result is just saying that the library is undefined as if react-native didn't find it in NativeModules.

Anyone else is encountering this issue? I created a stackoverflow question to keep this issue clean: http://stackoverflow.com/questions/42281942/library-not-linking-with-newer-versions-of-react-native

ping: @frostney

frostney commented 7 years ago

Hi @pgarciacamou, thank you for creating this issue. I just released version 1.1.0 which adds support for React Native > 0.40. Could you please try again and let me know if you still encounter this issue? Thank you for you patience.

pgarciacamou commented 7 years ago

@frostney excellent timing! I will test right away and let you know.

pgarciacamou commented 7 years ago

@frostney

You might want to remove peer dependencies from package.json.

  "peerDependencies": {
    "react-native": "^0.29.0",
    "react-native-windows": "^0.29.0"
  }

screen shot 2017-02-21 at 10 43 54 am

I was unable to link using react-native link.

To reproduce:

I create a library (https://github.com/pgarciacamou/react-native-lib):

  1. mkdir react-native-lib
  2. cd ./react-native-lib
  3. git init && git remote add origin git@github.com:pgarciacamou/react-native-lib.git
  4. react-native-create-library Lib
  5. removed package.json -> peer dependencies.
  6. git add . && git commit -m "run react-native-create-library" && git push origin master

I created a react-native app (https://github.com/pgarciacamou/LibTest):

  1. react-native init LibTest
  2. cd ./LibTest
  3. git init && git remote add origin git@github.com:pgarciacamou/LibTest.git
  4. npm install react react-native pgarciacamou/react-native-lib#master
  5. git add . && git commit -m "run react-native init" && git push origin master
  6. react-native link
  7. react-native run-ios

I debugged LibTest;

import { NativeModules/*, ... */ } from 'react-native'; 
import RNLib from 'react-native-lib';

export default class LibTest extends Component {
  componentDidMount() {
    console.log('RNLib');
    console.log(RNLib);
    console.log('NativeModules');
    console.log(NativeModules);
  }
  render () { ... }
}

// ...

and this is what I get:

screen shot 2017-02-21 at 6 21 39 pm

I didn't have time today to test linking manually, I'll try it tomorrow, although TBH this is the minimum viable product and there is no reason why this should not be working.

I'm starting to wonder if it is a bug that was introduced with react-native v0.40

sibelius commented 7 years ago

i think it is better to have react-native deps as devDependencies

sibelius commented 7 years ago

linking is not working using the master version of this package

frostney commented 7 years ago

@sibelius Thanks for catching this. I'll get right on fixing this.

sibelius commented 7 years ago

I figure it out the problem, linking is working fine

I was missing the --save tô add my lib dependency to package.json

pgarciacamou commented 7 years ago

@sibelius

i think it is better to have react-native deps as devDependencies

Why?

I was missing the --save tô add my lib dependency to package.json

What? I did this too and it didn't work for me. Are you sure that the NativeModule is not undefined? In my case, I import the npm module just fine, but the NativeModule is undefined so I can't access the methods from Objective-C.

Is there anything else you did different? Could you elaborate a bit more?

ugiacoman commented 7 years ago

@pgarciacamou This is happening to me as well. My obj-c code cannot find React... #import <React/RCTBridgeModule.h> not found. Any updates on this?

pgarciacamou commented 7 years ago

@ugiacoman what versions of react-native-create-library, react-native, react, react-native-cli, xcode do you have?

Also, how are you running the project?

ugiacoman commented 7 years ago

@pgarciacamou

react: 15.4.1 react-native-cli: 2.0.1 react-native: 0.42.3 react-native-create-library: 3.0.2

I don't have react install globally though, do I need to?

I tried opening the xcode project and running, but that didn't work. Also tried opening via react-native run-ios but couldn't find the header files.

Also for some reason I can't run react-native-create-library -V

pgarciacamou commented 7 years ago

@ugiacoman

I'm using

react: 15.4.2 react-native: 0.42.3 react-native-cli: 2.0.1 react-native-create-library: 1.1.0 xcode-select: 2343. node: v6.9.5

I don't have react install globally though, do I need to?

no

I tried opening the xcode project and running, but that didn't work. Also tried opening via react-native run-ios but couldn't find the header files.

Did you try to run the library alone? I believe there is nothing to run, right? react-native-create-library creates just a library that you can import (I could be wrong tho). Do you mean you created the library and then installed it somewhere else and it errored out?

pgarciacamou commented 7 years ago

@ugiacoman when you create the library with react-native-create-library it creates a README.md file with instructions on how to install/run it, did you follow those?

pgarciacamou commented 7 years ago

@ugiacoman let me know if it works for you, I've been meaning to close this issue since this answer I posted in StackOverflow.

ugiacoman commented 7 years ago

@pgarciacamou Ohhh, get it now, it all just came full circle. Thank you so much, it worked!

So the idea is you develop it within another project. Completely makes sense :) Do you think there should be something in the README to clarify the development process?

pgarciacamou commented 7 years ago

@ugiacoman

I'm glad it worked! 💪

So the idea is you develop it within another project.

To be honest, I haven't found best practices surrounding this subject (just some ideas here and there), and all the approaches I've found have disadvantages one way or another, so I guess it is up to you.

If you ask me, what I like to do is create a fully working example within the library, which has pros and cons as well 😩... For example, it allows other users to contribute easily (without having to create their own project to test new features or small contributions), but it creates an overhead withing the project (a fully working react-native app, including iOS files, etc...).

Do you think there should be something in the README to clarify the development process?

Not really, IMO that is beyond the functionality of this repo. I think the default README file doesn't include something like that because of the same idea above, the rest should be added by the developer depending on the approach taken to run the library (if any).


As a side note, when I create a working example within the library, I add a relative path to the package.json of the example that points to the parent directory which is the library. E.g:

> some-react-native-lib
   - index.js
   > example
      > some-react-native-project
         - package.json
// package.json
//  ...
"dependencies": {
  "react": "...",
  "react-native": "...",
  "some-react-native-lib": "../../"
}
//  ...