Pacharapol Withayasakpunt Pacharapol Withayasakpunt
Wed, December 25, 2019

Monorepo with three subrepos for web apps

I wonder how you usually set frontend repo and web server repo? Separate repo? Single repo with web server as parent?

However, as I have found Lerna and Rest.ts / RESTyped, I have starting to adapt one monorepo with three subrepos structure…

.
├── lerna.json
├── package.json
└── packages
    ├── api-definition
    │   └── package.json
    ├── server
    │   └── package.json
    └── web
        └── package.json

Where ./packages/web/ is created with @vue/cli.

As I also use Yarn Workspace, I adapted Lerna to use Yarn Workspace

// ./lerna.json
{
  "version": "independent",
  "npmClient": "yarn",
  "useWorkspaces": true
}
// ./package.json
{
  "private": true,
  "workspaces": [
    "packages/*"
  ]
}

Also, in each folder's package.json I use org-scope with

{
  "publishConfig": {
    "access": "public"
  }
}

When I run yarn or yarn install anywhere in the workspace, it will default install to ./node_modules

Now, I can reference @org/api-definition anywhere inside both ./packages/server and ./packages/web.

Example and working repo

https://github.com/patarapolw/web-api-typescript-monorepo

Now, with some questions,

  • Is using global .eslintrc.js and .eslintignore acceptable?
  • What about non-Node.js server? How would you set up the repo?