Interactive utility to create native React Native modules and views, with some major help from:
brodybits/create-react-native-module- based onfrostney/react-native-create-library(programmatic API usage)terkelg/promptsreact-native-community/cliviabrodybits/react-native-init-func
less opinionated than react-native-community/bob
brodybits@brodybits-mini-mac-book work % react-native-module-initℹ react-native-module-init 0.5.0✔ What is the desired native module name? … awesome module✔ Should it be a view? … no / yesℹ OK, continuing with isView: false✔ What is the full native module package name? … react-native-awesome-module✔ Initial package version is 1.0.0 - continue? … yes✔ What is the desired native object class name prefix (can be blank)? … super✔ Desired object class name to use between JavaScript & native code? … SUPERAwesomeModule✔ Which native platforms? › Android, iOS✔ What is the desired Android package id? … com.demo✔ Support Apple tvOS (requires react-native-tvos fork)? … no✔ What is the author name? … Christopher J. Brody✔ What is the author email? … chris.brody+brodybits@gmail.com✔ What is the GitHub user account name? … brodybits✔ What license? … MIT✔ Generate with sample use of Apple Networking? … noℹ It is possible to generate an example app for testing,ℹ with workarounds in metro.config.js for metro linking issuesℹ Requirements: Yarn; pod is needed for iOS✔ Generate the example app (with workarounds in metro.config.js)? … yes✔ Example app name? … example✔ What react-native template to use for the example app (should be for at least react-native@0.60)? … react-native@latestℹ checking that Yarn CLI can show its version✔ Yarn CLI okℹ generating the native library module as a packageCREATE new React Native module with the following options: name: awesome module full package name: react-native-awesome-module is view: false object class name: SUPERAwesomeModule Android nativePackageId: com.demo platforms: android,ios Apple tvosEnabled: false authorName: Christopher J. Brody authorEmail: chris.brody+brodybits@gmail.com author githubAccount: brodybits license: MIT useAppleNetworking: falseCREATE: Generating the React Native library module✔ native library module generated okℹ generating the example app[...]ℹ generating App.js in the example appℹ rewrite metro.config.js with workaround solutions✔ example app generated okℹ adding the native library module into the example app as a dependency linkyarn add v1.22.11[1/4] 🔍 Resolving packages...[2/4] 🚚 Fetching packages...[3/4] 🔗 Linking dependencies...warning "react-native > react-native-codegen > jscodeshift@0.11.0" has unmet peer dependency "@babel/preset-env@^7.1.6".warning "@react-native-community/eslint-config > @typescript-eslint/eslint-plugin > tsutils@3.21.0" has unmet peer dependency "typescript@>=2.8.0 || >= 3.2.0-dev || >= 3.3.0-dev || >= 3.4.0-dev || >= 3.5.0-dev || >= 3.6.0-dev || >= 3.6.0-beta || >= 3.7.0-dev || >= 3.7.0-beta".[4/4] 🔨 Building fresh packages...success Saved lockfile.success Saved 1 new dependency.info Direct dependencies└─ react-native-awesome-module@0.0.0info All dependencies└─ react-native-awesome-module@0.0.0✨ Done in 9.52s.✔ added the native library module into the example app as a dependency link - okℹ checking that the pod tool can show its version✔ pod tool okℹ starting additional pod install in ios subdirectory of example appAuto-linking React Native module for target `example`: react-native-awesome-moduleAnalyzing dependenciesDownloading dependenciesInstalling react-native-awesome-module (1.0.0)Generating Pods projectIntegrating client projectPod installation complete! There are 50 dependencies from the Podfile and 41 total pods installed.✔ additional pod install ok💡 check out the example app in react-native-awesome-module/exampleℹ (/Users/brodybits/work/react-native-awesome-module/example)💡 recommended: run Metro Bundler in a new shellℹ (cd react-native-awesome-module/example && yarn start)💡 enter the following commands to run the example app:ℹ cd react-native-awesome-module/exampleℹ yarn android # for React Native 0.60: npx react-native run-androidℹ yarn ios # for React Native 0.60: npx react-native run-ios⚠ first steps in case of a clean checkoutℹ run Yarn in react-native-awesome-module/exampleℹ (cd react-native-awesome-module/example && yarn)ℹ do `pod install` for iOS in react-native-awesome-module/example/iosℹ (cd react-native-awesome-module/example/ios && pod install)brodybits@brodybits-mini-mac-book work %
brodybits@brodybits-mini-mac-book work % ls react-native-awesome-moduleREADME.md iosandroid package.jsonexample react-native-awesome-module.podspecindex.jsbrodybits@brodybits-mini-mac-book work %
brodybits@brodybits-mini-mac-book work % cat react-native-awesome-module/index.js// main index.jsimport { NativeModules } from 'react-native';const { SUPERAwesomeModule } = NativeModules;export default SUPERAwesomeModule;brodybits@brodybits-mini-mac-book work %
brodybits@brodybits-mini-mac-book work % tree react-native-awesome-module/androidreact-native-awesome-module/android├── README.md├── build.gradle└── src └── main ├── AndroidManifest.xml └── java └── com └── demo ├── SUPERAwesomeModuleModule.java └── SUPERAwesomeModulePackage.java5 directories, 5 filesbrodybits@brodybits-mini-mac-book work %
brodybits@brodybits-mini-mac-book work % tree react-native-awesome-module/iosreact-native-awesome-module/ios├── SUPERAwesomeModule.h├── SUPERAwesomeModule.m├── SUPERAwesomeModule.xcodeproj│ └── project.pbxproj└── SUPERAwesomeModule.xcworkspace └── contents.xcworkspacedata2 directories, 4 filesbrodybits@brodybits-mini-mac-book work %
brodybits@brodybits-mini-mac-book work % ls react-native-awesome-module/exampleApp.js android babel.config.js ios node_modules yarn.lock__tests__ app.json index.js metro.config.js package.jsonbrodybits@brodybits-mini-mac-book work % react-native-module-initℹ react-native-module-init 0.5.0✔ What is the desired native module name? … awesome view✔ Should it be a view? … no / yesℹ OK, continuing with isView: true✔ What is the full native view package name? … react-native-awesome-view✔ Initial package version is 1.0.0 - continue? … yes✔ What is the desired native object class name prefix (can be blank)? … super✔ Desired object class name to use between JavaScript & native code? … SUPERAwesomeView✔ Which native platforms? › Android, iOS✔ What is the desired Android package id? … com.demo✔ Support Apple tvOS (requires react-native-tvos fork)? … no✔ What is the author name? … Christopher J. Brody✔ What is the author email? … chris.brody+brodybits@gmail.com✔ What is the GitHub user account name? … brodybits✔ What license? … MITℹ It is possible to generate an example app for testing,ℹ with workarounds in metro.config.js for metro linking issuesℹ Requirements: Yarn; pod is needed for iOS✔ Generate the example app (with workarounds in metro.config.js)? … yes✔ Example app name? … example✔ What react-native template to use for the example app (should be for at least react-native@0.60)? … react-native@latestℹ checking that Yarn CLI can show its version✔ Yarn CLI okℹ generating the native library module as a packageCREATE new React Native module with the following options: name: awesome view full package name: react-native-awesome-view is view: true object class name: SUPERAwesomeView Android nativePackageId: com.demo platforms: android,ios Apple tvosEnabled: false authorName: Christopher J. Brody authorEmail: chris.brody+brodybits@gmail.com author githubAccount: brodybits license: MIT useAppleNetworking: falseCREATE: Generating the React Native library module✔ native library module generated okℹ generating the example app[...]ℹ generating App.js in the example appℹ rewrite metro.config.js with workaround solutions✔ example app generated okℹ adding the native library module into the example app as a dependency linkyarn add v1.22.11[1/4] 🔍 Resolving packages...[2/4] 🚚 Fetching packages...[3/4] 🔗 Linking dependencies...warning "react-native > react-native-codegen > jscodeshift@0.11.0" has unmet peer dependency "@babel/preset-env@^7.1.6".warning "@react-native-community/eslint-config > @typescript-eslint/eslint-plugin > tsutils@3.21.0" has unmet peer dependency "typescript@>=2.8.0 || >= 3.2.0-dev || >= 3.3.0-dev || >= 3.4.0-dev || >= 3.5.0-dev || >= 3.6.0-dev || >= 3.6.0-beta || >= 3.7.0-dev || >= 3.7.0-beta".[4/4] 🔨 Building fresh packages...success Saved lockfile.success Saved 1 new dependency.info Direct dependencies└─ react-native-awesome-view@0.0.0info All dependencies└─ react-native-awesome-view@0.0.0✨ Done in 13.75s.✔ added the native library module into the example app as a dependency link - okℹ checking that the pod tool can show its version✔ pod tool okℹ starting additional pod install in ios subdirectory of example appAuto-linking React Native module for target `example`: react-native-awesome-viewAnalyzing dependenciesDownloading dependenciesInstalling react-native-awesome-view (1.0.0)Generating Pods projectIntegrating client projectPod installation complete! There are 50 dependencies from the Podfile and 41 total pods installed.✔ additional pod install ok💡 check out the example app in react-native-awesome-view/exampleℹ (/Users/brodybits/work/react-native-awesome-view/example)💡 recommended: run Metro Bundler in a new shellℹ (cd react-native-awesome-view/example && yarn start)💡 enter the following commands to run the example app:ℹ cd react-native-awesome-view/exampleℹ yarn android # for React Native 0.60: npx react-native run-androidℹ yarn ios # for React Native 0.60: npx react-native run-ios⚠ first steps in case of a clean checkoutℹ run Yarn in react-native-awesome-view/exampleℹ (cd react-native-awesome-view/example && yarn)ℹ do `pod install` for iOS in react-native-awesome-view/example/iosℹ (cd react-native-awesome-view/example/ios && pod install)brodybits@brodybits-mini-mac-book work %
brodybits@brodybits-mini-mac-book work % ls react-native-awesome-viewREADME.md iosandroid package.jsonexample react-native-awesome-view.podspecindex.jsbrodybits@brodybits-mini-mac-book work %
brodybits@brodybits-mini-mac-book work % cat react-native-awesome-view/index.js// main index.jsimport { requireNativeComponent } from 'react-native';const SUPERAwesomeView = requireNativeComponent('SUPERAwesomeView', null);export default SUPERAwesomeView;brodybits@brodybits-mini-mac-book work %
brodybits@brodybits-mini-mac-book work % tree react-native-awesome-view/androidreact-native-awesome-view/android├── README.md├── build.gradle└── src └── main ├── AndroidManifest.xml └── java └── com └── demo ├── SUPERAwesomeViewManager.java └── SUPERAwesomeViewPackage.java5 directories, 5 filesbrodybits@brodybits-mini-mac-book work %
brodybits@brodybits-mini-mac-book work % tree react-native-awesome-view/iosreact-native-awesome-view/ios├── SUPERAwesomeView.h├── SUPERAwesomeView.m├── SUPERAwesomeView.xcodeproj│ └── project.pbxproj└── SUPERAwesomeView.xcworkspace └── contents.xcworkspacedata2 directories, 4 filesbrodybits@brodybits-mini-mac-book work %
brodybits@brodybits-mini-mac-book work % ls react-native-awesome-view/exampleApp.js android babel.config.js ios node_modules yarn.lock__tests__ app.json index.js metro.config.js package.jsonbrodybits@brodybits-mini-mac-book work %
brodybits@brodybits-mini-mac-book work %