When your app gets bigger, managing files within a project gets more complex. You may start to have modules shared between front-end and back-end proj

How to Setup Monorepos with Git for JavaScript and TypeScript

submited by

Style Pass

2021-08-13 13:30:19

When your app gets bigger, managing files within a project gets more complex. You may start to have modules shared between front-end and back-end projects. Often, you also need to manage different versions of those modules.

I failed to set up a monorepo with Lerna a few times. Yalc and Yarn Workspace can be troublesome when I need to move a project out of the monorepo.

Finally, I found a way to make it work using git submodules. Git is great for resolving code conflicts. Git branches can be used for versioning. You can have unlimited private repositories for free when using Github or Gitlab. Besides, with TypeScript or JavaScript (using webpack), you can configure module aliases to create beautiful import paths.

In this post, I’ll show you how to set up a dependency, structure your project, and configure module aliases for a monorepo. See git-monorepo-project on Github for the final result

A dependency is a git repository. It can either contain a complete module (i.e with package.json and bundled/transpired JavaScripts files), or it may only have plain JavaScript or Typescript files.