![]() This means easier dependency management, shorter CI times, and better collaboration between teams since the code can be shared. Thanks to react-native-web we can share every component so there’s no need to duplicate the code many times. In this article, we’re going to set up a basic structure for a monorepo in React Native. Monorepos enable sharing the logic between a web app and a mobile app, for example. Working with monorepos is very useful, especially when developing big and complex applications like super apps. While the projects can be related, they can be used independently by different teams. Git config -global user.A monorepo is a single repository that holds a multitude of projects with all their code and assets. Jobs: publish-ui-components: name: Publish UI components to NPM runs-on: ubuntu-latest env: GITHUB_TOKEN: $" This is because Lerna will never publish if a repository is private. First, because we don’t want to publish the content of the `packages/app/*` directory, we need to add the line of code below to every package.json file. There are two other things we need to do before we’re done with setting up Lerna. In our case, it’s the `main` branch.Ĭheck out Lerna’s GitHub page to see more documentation about the `lerna.json` file. `` is an option that ensures that publishing only happens on a specified git branch. At Parca, we already follow the Conventional Commits style as seen in our contributing guide. The `conventionalCommits` option when enabled helps to populate a CHANGELOG.md with changes every time there’s a new release. This should have been exactly similar to the Yarn Workspaces setup, however, we omitted `packages/app/*` because we don't intend on publishing our apps, only the shared libraries. `packages` is an array of globs to use as package locations. The `useWorkspaces` flag is what will allow us to reuse the yarn workspace settings for lerna. `npmClient` is used to specify what type of package client to run commands with. Setting it to independent will mean maintaining the version of each package separately. The `version` has been explicitly set to a version number and this means that all the packages in our monorepo will share this version number. To initialize Lerna, we first need to add lerna to the project, using the command below. It contains the code for parsing data, profile viewing libraries, utility functions e.t.c The `packages/shared/*` directory is what we’re interested in publishing. `packages/shared/*` - this is where to find all our shared libraries and functions.`packages/app/*` - this is where to find all our apps, including the UI for Parca.This is an excellent and recommended article on setting up a monorepo using Yarn Workspaces.Īs you can see here we already have our workspaces defined in the package.json: We already have Yarn Workspaces set up in the Parca repository, so we will not be looking at how to set up one in this article. Publishing the UI components to a registry helps solve that problem because these UI components can then be easily used in other projects just by downloading them from the (npm) registry. ![]() ![]() We’re currently hard at work launching the open beta at and we’d like to reuse some of the components in the open-source Parca project without rewriting code from scratch. In a way, it is very similar to Yarn Workspaces which makes them a good combination for managing and publishing UI components. Using Lerna, you can iterate through all the packages, run a series of operations (such as linting, testing, and building) on each package. It also allows you to publish packages to any registry. Lerna is a tool that optimizes the workflow around managing multi-package repositories with git by providing high-level commands. It can also identify internal dependencies (for example, two packages in the shared folder depend on each other) and symlink them to make local development seamless. Yarn Workspaces helps to create and maintain a structure where every `package/app` has its `package.json` file but at the same time reduces bloat by hoisting all shared dependencies and installing them at the root of your project. The monorepo was initialized and maintained by using Yarn Workspaces. A shared folder that contains packages, functions, utils, and any other thing that can be reusable within apps and even packages. ![]()
0 Comments
Leave a Reply. |