👷‍♂️ Simple set of CLIs to scaffold and build React Native libraries for different targets

Overview

Bob

create-react-native-library react-native-builder-bob Build Status MIT License

👷‍♂️ Simple set of CLIs to scaffold and build React Native libraries for different targets.

Scaffold React Native libraries

If you want to create your own React Native module, scaffolding the project can be a daunting task. create-react-native-library can scaffold a new project for you with the following things:

  • Simple example modules for Android and iOS which you can build upon
  • Kotlin configured for building the module on Android
  • C++ support for native modules on Android and iOS
  • Expo support for libraries without native code and web support
  • Example React Native app to manually test your modules
  • ESLint, Prettier, TypeScript, Husky and Release It pre-configured
  • react-native-builder-bob pre-configured to compile your files
  • CircleCI pre-configured to run tests on the CI

To create new project, run the following:

npx create-react-native-library react-native-awesome-module

This will ask you few questions about your project and generate a new project in a folder named react-native-awesome-module.

Build React Native libraries

react-native-builder-bob can build code in your React Native library for following targets:

  • Generic CommonJS build
  • ES modules build for bundlers such as webpack
  • Flow definitions (copies .js files to .flow files)
  • TypeScript definitions (uses tsc to generate declaration files)
  • Android AAR files

Automatic configuration

To automatically configure your project to use react-native-builder-bob, open a Terminal and run:

npx react-native-builder-bob init

Manual configuration

To configure your project manually, follow these steps:

  1. First, install react-native-builder-bob in your project. Open a Terminal in your project, and run:
yarn add --dev react-native-builder-bob
  1. In your package.json, specify the targets to build for:

    "react-native-builder-bob": {
      "source": "src",
      "output": "lib",
      "targets": [
        ["aar", {"reverseJetify": true}],
        ["commonjs", {"copyFlow": true}],
        "module",
        "typescript",
      ]
    }

    See options below for more details.

  2. Add bob to your prepare step:

    "scripts": {
      "prepare": "bob build"
    }
  3. Configure the appropriate entry points:

    "main": "lib/commonjs/index.js",
    "module": "lib/module/index.js",
    "react-native": "src/index.ts",
    "types": "lib/typescript/index.d.ts",
    "files": [
      "lib/",
      "src/"
    ]

    Make sure to change specify correct files according to the targets you have enabled.

    It's usually good to point to your source code with the react-native field to make debugging easier. Metro already supports compiling a lot of new syntaxes including JSX, Flow and TypeScript and it will use this field if present.

    If you're building TypeScript definition files, also make sure that the types field points to a correct path. Depending on the project configuration, the path can be different for you than the example snippet (e.g. lib/typescript/index.d.ts if you have only the src directory).

  4. Add the output directory to .gitignore and .eslintignore

    # generated files by bob
    lib/
  5. Add the output directory to jest.modulePathIgnorePatterns if you use Jest

    /lib/"] ">
    "modulePathIgnorePatterns": ["/lib/"]

And we're done 🎉

Options

The options can be specified in the package.json file under the react-native-builder-bob property, or in a bob.config.js file in your project directory.

source

The name of the folder with the source code which should be compiled. The folder should include an index file.

output

The name of the folder where the compiled files should be output to. It will contain separate folder for each target.

targets

Various targets to build for. The available targets are:

commonjs

Enable compiling source files with Babel and use commonjs module system.

This is useful for running the code in Node (SSR, tests etc.). The output file should be referenced in the main field of package.json.

By default, this will compile the code for last 2 versions of modern browsers, as well as JSX. It'll also strip TypeScript and Flow annotations. You can customize the environments to compile for by using a browserslist config. To customize the babel config used, you can pass the configFile or babelrc options.

If your source code is written in Flow, You can also specify the copyFlow option to copy the source files as .js.flow to the output folder. If the main entry in package.json points to the index file in the output folder, the flow type checker will pick these files up to use for type definitions.

Example:

["commonjs", { "babelrc": true, "copyFlow": true }]
module

Enable compiling source files with Babel and use ES module system. This is essentially same as the commonjs target and accepts the same options, but leaves the import/export statements in your code.

This is useful for bundlers which understand ES modules and can tree-shake. The output file should be referenced in the module field of package.json.

Example:

["module", { "babelrc": true, "copyFlow": true }]
typescript

Enable generating type definitions with tsc if your source code is written in TypeScript.

By default, it'll use the tsconfig.json file in your project root. If you want to use a different config, you can specify it using the project option. Furthermore, the tsc binary will be resolved to ./node_modules/.bin/tsc. Use the tsc option to specify a different path.

Example:

["typescript", { "project": "tsconfig.build.json" }]
aar

Enable assembling Android AAR files for a library for React Native modules including native code.

It's also possible to convert the AAR with the reverseJetify option to use the Android support Library using the jetifier package if your package is using AndroidX. This is useful to publish packages for older projects which haven't migrated to AndroidX.

You can also specify the androidPath (defaults to android) to specify the android directory and androidBundleName (defaults to android.aar) to customize the name of AAR file. Example:

["aar", { "reverseJetify": true }]

FAQ

Why should I compile my project with react-native-builder-bob?

We write our library code in non-standard syntaxes such as JSX, TypeScript etc. as well as proposed syntaxes which aren't part of the standard yet. This means that our code needs to be compiled to be able to run on JavaScript engines.

When using the library in a React Native app, Metro handles compiling the source code. However, it's also possible to use them in other targets such as web, run in Node for tests or SSR etc. So we need to compile the source code for them as well.

Currently, to handle such multiple targets, we need to have multiple babel configs and write a long babel-cli command in our package.json. We also need to keep the configs in sync between our projects.

Just as an example, this is a command we have in one of the packages: babel --extensions '.js,.ts,.tsx' --no-babelrc --config-file=./babel.config.publish.js src --ignore '**/__tests__/**' --copy-files --source-maps --delete-dir-on-start --out-dir dist && del-cli 'dist/**/__tests__' && yarn tsc --emitDeclarationOnly. This isn't all, there's even a separate babel.config.publish.js file. And this only works for webpack and Metro, and will fail on Node due to ESM usage.

react-native-builder-bob wraps tools such as babel and typescript to simplify these common tasks across multiple projects. It's tailored specifically to React Native projects to minimize the configuration required.

How do I add a react-native library containing native code as a dependency in my library?

If your library depends on another react-native library containing native code, you should do the following:

  • Add the native library to peerDependencies: This makes sure that there are no conflicts between the version you have specified and the version user has installed (in case they also want to use that library). By deferring the installation to the user, it also makes sure the package manager installs it in correct location and that autolinking can work properly.
  • Add the native library to devDependencies: This makes sure that you can use it for tests, and there are no other errors such as type errors due to the missing module.
  • Add the native library to dependencies under example: This is equivalent to the consumer of the library installing the dependency, and is needed so that this module is also available to the example app.

Development workflow

To get started with the project, run yarn in the root directory to install the required dependencies.

yarn

While developing, you can run watch mode to automatically rebuild the changes:

yarn watch

To test the CLI locally, you can point to the bin/bob executable:

../bob/packages/create-react-native-library/bin/create-react-native-library

Before sending a pull request, make sure your code passes TypeScript and ESLint. Run the following to verify:

yarn typescript
yarn lint

To fix formatting errors, run the following:

yarn lint --fix

Acknowledgements

Thanks to the authors of these libraries for inspiration:

Alternatives

There are other similar tools to scaffold React Native libraries. The difference is that the generated project with create-react-native-library is very opinionated and configured with additional tools.

LICENSE

MIT

Comments
  • [Error: ENOENT: no such file or directory, open '/Users/xxx/Desktop/react-native-photos-picker/example/package.json']

    [Error: ENOENT: no such file or directory, open '/Users/xxx/Desktop/react-native-photos-picker/example/package.json']

    Description

    npx [email protected] react-native-photos-picker
    ✔ What is the name of the npm package? … react-native-photos-picker
    ✔ What is the description for the package? … react-native-photos-picker
    ✔ What is the name of package author? … Darkce
    ✔ What is the email address for the package author? … [email protected]
    ✔ What is the URL for the package author? … https://github.com/luoxuhai
    ✔ What is the URL for the repository? … https://github.com/luoxuhai/react-native-photos-picker
    ✔ What type of library do you want to develop? › Native module
    ✔ Which languages do you want to use? › Java & Swift
    â ¼ Generating examplecreate-react-native-library <name>
    
    create a react native library
    
    选项:
      --help                  显示帮助信息                                    [布尔]
      --version               显示版本号                                      [布尔]
      --slug                  Name of the npm package                       [字符串]
      --description           Description of the npm package                [字符串]
      --author-name           Name of the package author                    [字符串]
      --author-email          Email address of the package author           [字符串]
      --author-url            URL for the package author                    [字符串]
      --repo-url              URL for the repository                        [字符串]
      --languages             Languages you want to use
           [可选值: "java-objc", "kotlin-objc", "java-swift", "kotlin-swift", "cpp",
                                                                               "js"]
      --type                  Type of library you want to develop
                 [可选值: "library", "module-legacy", "view-legacy", "module-mixed",
                                                                       "module-new"]
      --react-native-version  Version of React Native to use, uses latest if not
                              specified                                     [字符串]
    
    [Error: ENOENT: no such file or directory, open '/Users/xxx/Desktop/react-native-photos-picker/example/package.json'] {
      errno: -2,
      code: 'ENOENT',
      syscall: 'open',
      path: '/Users/xxx/Desktop/react-native-photos-picker/example/package.json'
    }
    

    Packages

    • [X] create-react-native-library
    • [ ] react-native-builder-bob

    Selected options

    npx [email protected] react-native-photos-picker

    Link to repro

    No response

    Environment

    System:
        OS: macOS 13.0
        CPU: (8) arm64 Apple M1
        Memory: 101.34 MB / 16.00 GB
        Shell: 5.8.1 - /bin/zsh
      Binaries:
        Node: 17.5.0 - /usr/local/bin/node
        Yarn: 1.22.18 - /usr/local/bin/yarn
        npm: 8.4.1 - /usr/local/bin/npm
        Watchman: 2021.10.11.00 - /opt/homebrew/bin/watchman
      Managers:
        CocoaPods: 1.11.2 - /opt/homebrew/bin/pod
      SDKs:
        iOS SDK:
          Platforms: DriverKit 21.4, iOS 16.0, macOS 12.3, tvOS 16.0, watchOS 9.0
        Android SDK:
          API Levels: 29, 30, 32
          Build Tools: 28.0.3, 30.0.2, 32.0.0, 32.1.0
          System Images: android-30 | Intel x86 Atom_64, android-30 | Google APIs ARM 64 v8a, android-30 | Google APIs Intel x86 Atom_64, android-32 | Google APIs ARM 64 v8a
          Android NDK: Not Found
      IDEs:
        Android Studio: 2021.1 AI-211.7628.21.2111.8092744
        Xcode: 14.0/14A309 - /usr/bin/xcodebuild
      Languages:
        Java: 1.8.0_332 - /usr/bin/javac
      npmPackages:
        @react-native-community/cli: Not Found
        react: 18.0.0 => 18.0.0 
        react-native: 0.69.5 => 0.69.5 
        react-native-macos: Not Found
      npmGlobalPackages:
        *react-native*: Not Found
    
    bug 
    opened by luoxuhai 13
  • Watch command is not rebuilding

    Watch command is not rebuilding

    Maybe I'm using "watch" incorrectly.

    I want to watch for changes under the './src/' directory.

    When I make a change all I see is message stating it's a directory, the rebuild is not triggered...

    ➜ yyy-ui-components git:(master) ✗ yarn watch ./src/ yarn run v1.22.10 $ /Users/xxx/workspace/nextga/yyy-ui-components/node_modules/.bin/watch ./src/

    Watching /Users/xxx/workspace/yyy/yyy-ui-components sh: ./src/: is a directory sh: ./src/: is a directory sh: ./src/: is a directory

    opened by buffaloDeveloper 13
  • feat: add support for Java templates

    feat: add support for Java templates

    Summary

    This PR adds support for Java templates (both native module and native view types).

    With this, Bob now supports all four possible combinations:

    • Java + Objective-C
    • Java + Swift
    • Kotlin + Objective-C
    • Kotlin + Swift

    image

    Commit Details

    The PR head branch contains 3 commits with incremental changes (one way dependency), best reviewed in succession.

    Move Kotlin templates to separate directory

    As the subject line states, this merely renames the existing Kotlin templates directory to kotlin-library, similar to the existing objc-library/swift-library categories. No functional changes, but prepares for the next commit with independent precursor work in src/create.ts.

    Add Java templates

    All new templates in templates/java-library and templates/java-view-library. Additional changes in src/create.ts to add the selection to the bob create command.

    Combine native and native-view into native-common

    This final commit again does not add any new functionality, but removes a large number of duplications by combining native-library and native-view-library into native-common (both on the Android and iOS side). I can move this one to a separate PR if preferred.

    Test plan

    Use bob create <name> and select one of the new templates, verify that everything works.

    Closes #82

    Once approved, please use a normal GitHub merge (i.e. NO rebase/squash merge) to integrate the commit(s) from the PR head branch. The changes are broken up into meaningful, atomic commits, and my branch should already be up-to-date with the latest base branch. If it isn't, or if you want me to change anything, please let me know, and I will update the branch as soon as possible. Thank you!

    opened by friederbluemle 12
  • chore: use react-native init for generating example app

    chore: use react-native init for generating example app

    Summary

    The current state of the library requires manual labor to upgrade example apps. Instead of manually upgrading the example app we can rely on React Native CLI to generate the app for us. We can then simply make necessary changes to the created template.

    How does it work?

    We first run npx react-native init <projectName>Example --template react-native-template-typescript --directory example --skip-install to create the app. We then make the following changes:

    1. Delete .gitignore, .eslintrc.js, .prettierrc.js, index.js and App.js
    2. Overwrite metro.config.js and babel.config.js
    3. Write react-native.config.js, src/App.tsx and index.ts
    4. Change package.json:
      • Remove test and lint scripts then add pods and postInstall scripts
      • Remove some dependencies @react-native-community/eslint-config @tsconfig/react-native @types/jest @types/react-native @typescript-eslint/eslint-plugin @typescript-eslint/parser babel-jest eslint jest typescript
      • Add some dependencies 'babel-plugin-module-resolver': '^4.1.0' 'metro-react-native-babel-preset': '^0.72.1' 'patch-package': '^6.4.7' 'postinstall-postinstall': '^2.1.0'
      • remove jest config
    5. If TurboModules are enabled; set newArchEnabled=true on android/gradle.properties and add ENV['RCT_NEW_ARCH_ENABLED'] = '1' to ios/Podfile
    6. Edit __tests__/App-test.tsx to import App from ../src/App
    7. Set root level package.json's react and react-native versions from example/package.json

    Notes and issues

    • Currently we delete __tests__ folder inside example directory. The reason is that this folder includes react-test-renderer tests. These tests run fine when they are called from example/package.json. But when you try to call them from root level package.json, it throws the following:
    example/__tests__/App-test.tsx
      ● Test suite failed to run
    
        Invariant Violation: __fbBatchedBridgeConfig is not set, cannot invoke native modules
    
          at invariant (example/node_modules/invariant/invariant.js:40:15)
          at Object.invariant (example/node_modules/react-native/Libraries/BatchedBridge/NativeModules.js:180:3)
          at Object.require (example/node_modules/react-native/Libraries/TurboModule/TurboModuleRegistry.js:11:23)
    

    I have tried many things but couldn't get it working properly. This is not a regression as before this PR, we didn't have these tests at all.

    Test plan

    • [x] Turbo module with backward compat (experimental)
    • [x] Turbo module (experimental)
    • [x] Native module
    • [x] Native view
    • [x] JavaScript library
    • [x] Expo app
    • [ ] Ensure lint, test and typescript scripts work properly on generated project

    Next steps

    Follow this approach for Expo modules

    opened by atlj 10
  • Upgrade to RN 0.66+

    Upgrade to RN 0.66+

    Describe the feature

    Upgrade the package.json to generate modules with 0.66+ RN.

    Motivation

    React Native is on version o.66.1 https://github.com/facebook/react-native/releases/tag/v0.66.1 but the modules generated with this library are sstill on 0.63.

    Related Issues

    It is good to keep modules updated.

    opened by wilsolutions 10
  • Adding an external dependency on the module - Android

    Adding an external dependency on the module - Android

    Hi I want my react native module to import a SDK as a dependency. In iOS it's already working, but i have little experience with android.

    Im my react native module buidle.gradle i added the following repo inside the repositories object.

    maven {
        url "s3://repo.pagesuite.com/android/"
        credentials(AwsCredentials) {
          accessKey = ""
          secretKey = ""
        }
     }
    

    On the same file i added the following import to the dependencies object.

    implementation "repo.android.pagesuite.com:psReaderSdkForClients:0.48"
    

    After this, i compile the project and i see the dependencies on the external libraries and i actually can use the SDK.

    The problem is, when i compile the example project it throws a dependency error:

    Could not find repo.android.pagesuite.com:psReaderSdkForClients:0.48.
    
    Searched in the following locations:
      - file:/Users/user/.m2/repository/repo/android/pagesuite/com/psReaderSdkForClients/0.48/psReaderSdkForClients-0.48.pom
      - file:/Users/user/Documents/PageSuite/project/react-native-pagesuite/example/node_modules/react-native/android/repo/android/pagesuite/com/psReaderSdkForClients/0.48/psReaderSdkForClients-0.48.pom
      - file:/Users/user/Documents/PageSuite/project/react-native-pagesuite/example/node_modules/jsc-android/dist/repo/android/pagesuite/com/psReaderSdkForClients/0.48/psReaderSdkForClients-0.48.pom
      - https://dl.google.com/dl/android/maven2/repo/android/pagesuite/com/psReaderSdkForClients/0.48/psReaderSdkForClients-0.48.pom
      - https://jcenter.bintray.com/repo/android/pagesuite/com/psReaderSdkForClients/0.48/psReaderSdkForClients-0.48.pom
      - https://www.jitpack.io/repo/android/pagesuite/com/psReaderSdkForClients/0.48/psReaderSdkForClients-0.48.pom
    Required by:
        project :app > project :reactnativepagesuite
    

    The dependency appears on the external libraries too. What am i missing?

    opened by TfADrama 9
  • feat: add fabric option

    feat: add fabric option

    Summary

    Close https://github.com/callstack/react-native-builder-bob/issues/238

    Screenshot 2022-09-06 at 15 25 48

    Test plan

    • [ ] Turbo module with backward compat (experimental)
    • [ ] Turbo module (experimental)
    • [ ] Native module
    • [ ] Native view
    • [ ] JavaScript library
    opened by troZee 8
  • Flipper: 'event2/event-config.h' file not found

    Flipper: 'event2/event-config.h' file not found

    Ask your Question

    I'm running the instructions to create a module and run the example, but it seems there is an issue with Flipper?

    In the end I get: example/ios/Pods/Headers/Public/libevent/event.h:44:10: fatal error: 'event2/event-config.h' file not found

    Does anyone have any suggestions for what I can do to fix this issue?

    bug 
    opened by thertzelle 8
  • React native linking

    React native linking

    Question

    I am facing an issue in linking some dependency which is required in package I am creating. For example, Async storage is required for my new package but where I am installing my package, doesn't have Async storage. How can I achieve this?

    opened by sidhanshumonga 8
  • How does one use a different react native package (separate for android and ios)

    How does one use a different react native package (separate for android and ios)

    hi we are looking to build a SDK using react native that is usable on ios and android.

    one of the functionality we want to include is the Razorpay payment gateway - https://razorpay.com/docs/payment-gateway/react-native-integration/standard/

    how do we integrate this kind of a package into a Bob build ?

    help wanted docs 
    opened by sandys 8
  • ✖ Errors found when building definition files. error TS5023: Unknown compiler option 'emitdeclarationonly'.

    ✖ Errors found when building definition files. error TS5023: Unknown compiler option 'emitdeclarationonly'.

    > bob build
    
    ℹ Building target commonjs
    ℹ Cleaning up previous build
    ℹ Compiling 7 files in src with babel
    ✓ Wrote files to lib/commonjs
    ℹ Building target module
    ℹ Cleaning up previous build
    ℹ Compiling 7 files in src with babel
    ✓ Wrote files to lib/module
    ℹ Building target typescript
    ℹ Cleaning up previous build
    ℹ Generating type definitions with tsc
    ✖ Errors found when building definition files.
    error TS5023: Unknown compiler option 'emitdeclarationonly'.
    
    bob build
    
    build files for publishing
    
    Options:
      --help     Show help                                                 [boolean]
      --version  Show version number                                       [boolean]
    
    Error: Failed to build definition files.
        at build (/Users/gaodeng/Documents/work/moonfmlib/node_modules/@react-native-community/bob/lib/targets/typescript.js:46:11)
        at <anonymous>
    npm ERR! code ELIFECYCLE
    npm ERR! errno 1
    npm ERR! [email protected] prepare: `bob build`
    npm ERR! Exit status 1
    npm ERR! 
    npm ERR! Failed at the [email protected] prepare script.
    npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
    
    npm ERR! A complete log of this run can be found in:
    npm ERR!     /Users/gaodeng/.npm/_logs/2019-04-20T00_22_55_222Z-debug.log
    
    opened by gaodeng 8
  • build.gradle issue when opening Android part of a module created by npx create-react-native-library react-native-awesome-module

    build.gradle issue when opening Android part of a module created by npx create-react-native-library react-native-awesome-module

    Description

    easy to reproduce : I just follow the doc from https://reactnative.dev/docs/native-modules-setup npx create-react-native-library react-native-awesome-module then I open with Android Studio the Android part of the react-native-awesome-module and I get the fatal error for me :

    Build file '/mymodules/react-native-awesome-module/android/build.gradle' line: 118
    
    A problem occurred evaluating root project 'android'.
    > android: unable to locate React Native android sources. Ensure you have you installed React Native as a dependency in your project and try again.
    

    So I cannot debug my module as described in https://reactnative.dev/docs/native-modules-android#setup

    Packages

    • [X] create-react-native-library
    • [ ] react-native-builder-bob

    Selected options

    none

    Link to repro

    No response

    Environment

    $ npx react-native info error Failed to load configuration of your project.

    bug 
    opened by Productivix 0
  • Created Library Does Not Work When Actually Imported In External React Native app

    Created Library Does Not Work When Actually Imported In External React Native app

    Description

    Created a library like so:

    npx [email protected] awesome-library
    

    Modified it slightly, re-build it in /example, then yarn start to serve the app. It built, ran, and worked as expected. No warnings. No errors.

    I ran yarn release and it steps through the npm publishing and the Github release creation. It successfully creates the npm package.

    I then ran the following commands to scaffold a new project and install the packages:

    npx react-native init AwesomeProject
    cd AwesomeProject
    yarn
    yarn add my-custom-package
    cd ios
    pod install
    

    I import and use the library I created and once I click on a button to interact it with it, I see this:

    Error: The package 'my-custom-package' doesn't seem to be linked. Make sure: 
    - You have run 'pod install'
    - You rebuilt the app after installing the package
    - You are not using Expo Go
    

    I've run pod install - I've re-built the app - and I'm not using Expo Go.

    My native module was an extremely simple extension of the original base project.

    Not sure where to go from here. Appreciate any tips or suggestions. Thanks

    Packages

    • [x] create-react-native-library
    • [ ] react-native-builder-bob

    Selected options

    Native Module Swift + Java

    Link to repro

    No response

    Environment

    info Fetching system and libraries information... System: OS: macOS 13.0 CPU: (10) arm64 Apple M1 Pro Memory: 82.97 MB / 16.00 GB Shell: 5.8.1 - /bin/zsh Binaries: Node: 16.18.0 - ~/.nvm/versions/node/v16.18.0/bin/node Yarn: 1.22.19 - ~/.nvm/versions/node/v16.18.0/bin/yarn npm: 8.19.2 - ~/.nvm/versions/node/v16.18.0/bin/npm Watchman: 2022.11.28.00 - /opt/homebrew/bin/watchman Managers: CocoaPods: 1.11.3 - /usr/local/bin/pod SDKs: iOS SDK: Platforms: DriverKit 22.1, iOS 16.1, macOS 13.0, tvOS 16.1, watchOS 9.1 Android SDK: Not Found IDEs: Android Studio: Not Found Xcode: 14.1/14B47b - /usr/bin/xcodebuild Languages: Java: Not Found npmPackages: @react-native-community/cli: Not Found react: Not Found react-native: Not Found react-native-macos: Not Found npmGlobalPackages: react-native: Not Found

    bug 
    opened by trevorwhealy 0
  • Getting NaN on running the example project

    Getting NaN on running the example project

    Description

    I used the create-react-native-library to create a library, with the library being the "Native module" and the language being "C++". When I executed yarn followed by yarn example android, I got NaN value. I have made no changes to the default project.

    Packages

    • [X] create-react-native-library
    • [ ] react-native-builder-bob

    Selected options

    What type of library do you want to develop? › Native module Which languages do you want to use? › C++ for Android & iOS

    Link to repro

    No response

    Environment

    System: OS: Linux 5.15 undefined CPU: (12) x64 AMD Ryzen 5 3600 6-Core Processor Memory: 2.36 GB / 15.55 GB Shell: 5.9 - /usr/bin/zsh Binaries: Node: 18.12.1 - ~/.nvm/versions/node/v18.12.1/bin/node Yarn: 1.22.19 - /usr/bin/yarn npm: 8.19.2 - ~/.nvm/versions/node/v18.12.1/bin/npm Watchman: Not Found SDKs: Android SDK: Not Found IDEs: Android Studio: AI-212.5712.43.2112.8815526 Languages: Java: 17.0.5 - /home/sshivaditya/.sdkman/candidates/java/current/bin/javac npmPackages: @react-native-community/cli: Not Found react: 18.1.0 => 18.1.0 react-native: 0.70.6 => 0.70.6 npmGlobalPackages: react-native: Not Found

    bug 
    opened by sshivaditya2019 0
  • Add new swift file not in scope

    Add new swift file not in scope

    Description

    Hello I have a problem when create project with create-react-native-library I keep find this error when create new swift file File not found in scope

    Packages

    • [X] create-react-native-library
    • [ ] react-native-builder-bob

    Selected options

    Create-react-native-library

    Link to repro

    No response

    Environment

    Mac osx 10.15 React native 0.70

    bug 
    opened by karimsaad687 0
  • does react-native builder bob support use_frameworks!() ?

    does react-native builder bob support use_frameworks!() ?

    does react-native builder bob support use_frameworks!() ?

    I am trying to add react native firebase in my example ios project. react-native-firebase [recommends](Notes: React-Native-Firebase uses use_frameworks, which has compatibility issues with Flipper, Hermes & Fabric.

    Flipper: use_frameworks is not compatible with Flipper. You need to disable Flipper by commenting out the :flipper_configuration line in your Podfile.) using use_fireworks . If I disable use_flipper the example project is unable to resolve the exported header files from module folder.

    question 
    opened by FahadAminShovon 0
  • Consider leveraging React Native Test App

    Consider leveraging React Native Test App

    Describe the feature

    RNTA https://github.com/microsoft/react-native-test-app is a project allowing library developers to add examples for various platforms. I wonder if it would make sense to use it by Bob? I don't have any opinions about it right now, just shooting an idea for discussion.

    cc @tido64 @kelset – would be great to have your perspective as well :D

    Motivation

    Maybe there's an opportunity to offload some work to RNTA project, which would make Bob easier to maintain.

    feature request 
    opened by thymikee 2
Owner
Callstack
We support and inspire other developers and companies to launch their products for everyone at the same time, on every platform
Callstack
A react scaffold with redux and its best practice

React Redux Scaffold This is a seed project for building static react website, not for build universal app. Feature ES6+ support via babel Redux and i

Jiu LianCheng 85 Jul 19, 2022
A scaffold boilerplate including TypeScript, React, Jest and ESLint

A scaffold boilerplate including TypeScript, React, Jest and ESLint

UIUX Lab 2 Feb 17, 2022
A react scaffold built with vite

一个用vite构建的react脚手架(A react scaffold built with vite)

null 26 Nov 1, 2022
React Native Typescript Template with scalable design and cutting edge technologies like CodePush, Sentry and other libraries pre-configured to save your time.

A React Native Template/Boilerplate containing the best practices and scalable design with cutting edge technologies like CodePush/Sentry and all other neccessary libraries pre-configured and basic helper functions and components to help you save your time and make your App super fast.

KASHAN HAIDER 23 Dec 1, 2022
An ongoing curated list of frameworks, books, articles, talks, screencasts, recordings, libraries, learning tutorials and resources about React Native Framework Development.

React Native Development Welcome to React Native. An ongoing curated list of frameworks, books, articles, talks, screencasts, recordings, libraries, l

Paul Veillard 3 Feb 1, 2022
A toolkit for React, Preact, Inferno & vanilla JS apps, React libraries and other npm modules for the web, with no configuration (until you need it)

nwb nwb is a toolkit for: Quick Development with React, Inferno, Preact or vanilla JavaScript Developing: React Apps Preact Apps Inferno Apps Vanilla

Jonny Buchanan 5.5k Jan 3, 2023
Project similar to the Create React App for libraries and dependencies

Create React Dependency • • • Contributing | Code of Conduct Project similar to the Create React App for libraries and dependencies. It creates a read

André Lins 25 Dec 21, 2022
Math Magicians is a website for performing basic maths calculations, This website is built using REACT and JavaScript libraries.

Math Magicians Math Magicians is a website for performing basic maths calculations, This website is built using REACT and JavaScript libraries. Screen

Ranjeet Singh 12 Oct 20, 2022
An ethereum, next.js, and react.js boilerplate using only open source libraries

An ethereum, next.js, and react.js boilerplate using only open source libraries

ilyxium 65 Dec 3, 2022
An ethereum, next.js, and react.js boilerplate using only open source libraries

An ethereum, next.js, and react.js boilerplate using only open source libraries

Yannik Sood 65 Dec 3, 2022
A collection of 14 different React projects like Music Player, Weather App, Crypto Tracker, Chat Room, Currency Converter, COVID Tracker, To-do and Expense App, Color Generator etc.

Simple React Projects Note: If any project does not work Online download the project and run on your local Storage (Error is coming due to Local Stora

MD Yasin 22 Sep 15, 2022
A highly scalable boilerplate with pre added web3 and different wallets

NFT-Dapp-Boilerplate Start your next dapp / defi project in seconds A highly scalable boilerplate with pre added web3 and different wallets with a foc

Green Lettel 6 May 21, 2022
A repo containing the same app built with different frameworks and integrated with CommandBar.

Using CommandBar with frameworks This is a repo containing the same app built with different frameworks and integrated with CommandBar. The app used i

null 2 Dec 3, 2022
🤩 Specify various templates for different directories and create them with one click.

Specify various templates for different directories and create them with one click.

赵東澔 16 Aug 8, 2022
Boilerplate for creating React component libraries, bundled with Rollup.js to ES6 Modules, React Styleguidist, Typescript

Boilerplate for creating React component libraries, bundled with Rollup.js to ES6 Modules, React Styleguidist, Typescript

Kai Hotz 239 Dec 29, 2022
🏗️ WIP React portfolio landing page using some common libraries, with planned Apollo integration into github API. (WIP)

?? React Portfolio Portfolio One-Pager made with ReactJs Live Preview Home background effect made with React-Particles ??️ Packages & APIs React graph

Matthew Jigalin 45 Jan 5, 2023
A boilerplate for building React libraries

React Rollup Boilerplate A boilerplate for building React libraries. Included Yarn Plug'n'Play and workspaces support ES Module system support Build p

Michael Tran 31 Nov 6, 2022
💥A cross-platform Node.js based CLI that generates boilerplate code for different tailwind web applications.

??A cross-platform Node.js based CLI that generates boilerplate code for different tailwind web applications.

Saad Irfan ⚡️ 237 Dec 28, 2022
Creates a Module Federation applcation, API server, or library based on one of multiple different templates.

create-mf-app Creates a Module Federation applcation, API server, or library based on one of multiple different templates. npx create-mf-app These pr

Jack Herrington 392 Dec 30, 2022