How to: Create Private Package React Native

Tutorial: Creating a React Native Package

To start creating your React Native package, use the following command:

npx create-react-native-library <package_name>

• Steps to Create a Private Package on GitHub

  Create a Private Repository on GitHub

  • • First, set up a new private repository on GitHub.

          Generate a GitHub Token

• • • Go to your GitHub settings and create a new token on GitHub here
    • Ensure that you grant the token write:package permissions and workflow access.

Make sure to check the write:package permissions and workflow

          Modify package.json for Publishing

• • • Update the publishConfig attribute in your package.json file to specify the GitHub registry.

Open your package.json, and change the “publishConfig” attribute to:

"publishConfig": {
    "registry": "<https://npm.pkg.github.com>"
  },

           Login to GitHub via Terminal

• • • Use the terminal to log in to GitHub with the following command:

npm login –registry=https://npm.pkg.github.com

username: GitHub username
password: Token (newly created token using the above steps)
email: your email

          Add .npmrc to Your Project Root

• • • Create an .npmrc file in the root directory of your project and add the following line:

//npm.pkg.github.com/:_authToken=<token>

         Optional: Update lefthook.yml for Pre-commit Linting

• • • To avoid linting issues during commits, you can update your lefthook.yml as follows:

pre-commit:
  parallel: true
  commands:
    lint:
      files: git diff --name-only @{push}
      glob: '*.{js,ts,jsx,tsx}'
      run: npx eslint {files}
    types:
      files: git diff --name-only @{push}
      glob: '*.{js,ts, jsx, tsx}'
      run: npx tsc --noEmit

          Update the name Attribute in package.json

• • • Prefix the package name with your GitHub username in package.json:

Tambahkan @username/ diawal.
{
	"name": "@widianapw/react-native-multiplier",

          Push to GitHub

• • • Push your changes to the GitHub repository.

          Create a Release on GitHub

• • • Navigate to the releases page of your repository and create a new release.

https://github.com/widianapw/react-native-multiplier/releases

      Publish the Package

• • • Finally, publish your package with the following command:

npm publish


Once published, the package will appear on the right side of your GitHub repository page.

Using the Private Repository

        Initialize a New Project (Optional)

• • You can start a new project with:

npm init

       Add .npmrc to the Project Root

• • In the new project, create an .npmrc file with the following content:

//npm.pkg.github.com/:_authToken=<token>
@<username>:registry=https://npm.pkg.github.com

       Install the Package

• • Add your package to the project using:

yarn add @<username>/<packagename>

With these steps, you can successfully create and use a private React Native package hosted on GitHub. This ensures your package remains secure and accessible only to authorized users.

Need Help Digitalizing Your Business?

If you require assistance with creating private packages or any other aspect of digitalizing your business, don’t hesitate to reach out to Timedoor Indonesia. Our team of experts is ready to help you transform your digital presence and enhance your business operations.

Contact us today to get started on your journey towards digital excellence!