Skip to content

Latest commit

 

History

History
117 lines (87 loc) · 5.09 KB

DEVELOPMENT.md

File metadata and controls

117 lines (87 loc) · 5.09 KB
Raw

Developing React Native Fontawesome

Tasks

The following commands are available through npm run

Command Purpose
dist Transpile code into dist/, to be checked in so the GitHub repo can be sourced directly from a package.json file
test Run tests

Set up Development Environment (iOS)

Use guidelines in the React Native development docs to get your environment set up in your OS. For Mac OS X, that would look like:

  1. brew install node # if you don't already have node 8.3 or later
  2. brew install watchman # watches filesystem for changes
  3. npm install -g react-native-cli # react-native CLI
  4. Install XCode, probably from the App Store. Make sure it's version 9.4 or later. Also set up the XCode Command Line Tools.
  5. clone this repo

Launch the Example App

In the examples/react-native-expo subdirectory, the following script commands are available:

Command Purpose
start Start JavaScript bundler, listening on a port
ios Build the ios XCode project (requires XCode set up)
android Build the Android project
start-with-cache-reset Useful when after modifying JavaScript modules, something isn't resolving that you're pretty sure should be there
clean clean out build cache. Useful when the build isn't working and you're pretty sure it should be

In one terminal tab:

  1. cd examples/react-native-expo
  2. npm install
  3. npm run start

This will get the JavaScript bundler running and listening for connections from a device or iOS Simulator.

In another terminal tab: 1 cd examples/react-native-expo

  1. react-native link react-native-svg # to link the native components in the ios project
  2. npm run ios

This will build the project via XCode, launch the iOS Simulator, and when the project builds successfully, install the app into the Simulator and have it connect to the JavaScript bundler. When it's all built and loaded, it will render the view for the example app--with Font Awesome icons.

Dealing with Flaky Build Problems

Seems like things don't always go smoothly and you have to use some hackery to get the build unjammed.

Try this:

  1. shutdown any instances of the bundler you have running.
  2. npm run clean
  3. npm run start-with-cache-reset # from the examples/react-native-expo directory

From another terminal tab:

  1. npm run ios

Update Example App to Use a Newer Version of this Component

For now, we're just using the GitHub repo as our source for development versions. This means that when you want to test changes to the component using the example app, you'll have to push the component changes to a development branch and then update the package.json of the example app to pull the component from that branch.

Here's the step-by-step:

  1. make changes to this component
  2. npm run dist # to transpile via babel into dist/
  3. git commit # whatever changes you're trying to commit
  4. git push origin my-dev # to whatever topic branch you're working on, say "my-dev"
  5. Modify examples/react-native-expo/package.json and find the line that looks like this: "@fortawesome/react-native-fontawesome": "^0.0.1" And change it to something like this: "@fortawesome/react-native-fontawesome": "https://github.com/FortAwesome/react-native-fontawesome#my-dev"
  6. npm update or yarn upgrade # insist that packages be updated, in this case, that the code from the GitHub branch be pulled down into node_modules
  7. Launch the Example App using the instructions above.

Releasing a new version

  1. Edit package.json and update the version number
  2. Add new contributors to the contributors section
  3. Update the README.md and add any contributors
  4. Update the CHANGELOG.md
  5. npm run dist
  6. npm run test
  7. npm publish
  8. npm publish --registry https://npm.fontawesome.com (publish to Pro registry)
  9. git add . && git commit -m 'Release VERSION'
  10. git push
  11. Create a new release with CHANGELOG details

Authenticating with the npm.fontawesome.com registry

Contributors with authorization to publish to npm.fontawesome.com will receive an invite from a Font Awesome project owner.

  1. Respond to the invite in your email
  2. Let the owner know when you've setup your account
  3. Owner will add you to the team

You can then run:

npm login --registry https://npm.fontawesome.com
  • The username is the "slug" for your Cloudsmith account. For example mine is "rob-madole".
  • Enter the password that you setup just a few minutes ago.
  • It says the your email is PUBLIC. Pretty sure that's false since the auth is through Cloudsmith.
  • This doesn't overwrite your standard login, just adds to your ~/.npmrc