I tried to google a bit and the approaches vary a lot. Some people link their github and suggest to just clone it, some people go overboard and suggest to use Docker, some recommend very specific tool that was written recently..
I use Node, pnpm as package manager, prettier and eslint with flat config, vitest for testing and if possible I'd like to keep using these tools. And I don't really want to use container solutions like Docker.
Are there any up-to-date recommended solutions?
#Is there an easy up to date monorepo setup?
vague cargo
plucky siren
depends what you mean by monorepo
how much tooling you want/expect, etc.
you have "npm workspaces" and the pnpm equivalent
they should be good enough, but aren't really fully fledged
also, Docker is for deployment, it's not related to monorepos
it's a different piece of technology
vague cargo
Are there different approaches to monorepo?
Ideally I want to have lots of packages with some of them being dependant on each other while others being separate. Some of them are going to be used strictly in browser, others in Node and the third are common.
For build I guess I will go with esbuild eventually since it's the easiest one.
plucky siren
if you want more powerful tooling (if you have dependencies between projects, or need multiple commands in a certain order)
then there are some well-known tools: turborepo, nx, lerna, bazel, rush, etc.
vague cargo
Out of those are there any that are more commonly used or is it a "we have 5 different standards, let's create a new better one" approach? 🙂
plucky siren
most of those tools appeared around the same time, to solve the same problem, but in slightly different ways
mainly referring to nx and lerna
turborepo came (along turbopack, which was an improvement to webpack)
bazel was Google's own internal tool iirc
etc.
rain hemlock
plucky siren
but I'd still recommend having a look at pnpm workspaces
and see what it has to offer, if it's enough
or if you need more complex tooling, espacially when it comes to building and dependency management
nx and lerna are pretty much their own thing, can be a bit overkill sometimes imo
don't have much expereicen with pnpm workspaces, but if it's simply pnpm version of npm workspaces
then you will prolly be limited
it mainly automatically installs local copies of some shared packages you have
(let's say you have an app, a shared lib, then client lib a, and client lib b; then you can have all of them in the same repo, publish them on a repository, and use a local copy for local development)
vague cargo
Got it, ty, will take a look at different solutions
vague cargo
I decided to with turborepo and use "with Vite" (https://github.com/vercel/turbo/tree/main/examples/with-vite) example as a basis. However I'm somewhat confused on how to transform shared ESLint config packages/config-eslint from old format info flat format.
I modified packages/config-eslint/index.js to use strict config + some extra rules:
// @ts-check
import eslint from "@eslint/js";
import tseslint from "typescript-eslint";
export default tseslint.config(
eslint.configs.recommended,
...tseslint.configs.strictTypeChecked,
...tseslint.configs.stylisticTypeChecked,
{
languageOptions: {
parserOptions: {
project: true,
tsconfigRootDir: import.meta.dirname,
},
},
rules: {
"@typescript-eslint/member-ordering": "warn",
"@typescript-eslint/prefer-nullish-coalescing": [
"error",
{
ignoreConditionalTests: true,
},
],
"@typescript-eslint/restrict-template-expressions": [
"error",
{
allowNumber: true,
},
],
},
}
);
However I'm getting an error "Property 'dirname' does not exist on type 'ImportMeta'.ts(2339)".
low yew
@vague cargo https://stackoverflow.com/a/50052194 - import.meta.dirname is quite recent, you'll probably need very up-to-date @types/node to include it.
