2 ms·
I really like https://github.com/google/wireit/ https://github.com/google/wireit/ for this purpose! My monorepo looks like this: project-1/packages/core
by bsimpson 4y ago
I really like https://github.com/google/wireit/ https://github.com/google/wireit/ for this purpose!
My monorepo looks like this:
project-1/packages/core
project-1/packages/preact
project-2/packages/core
project-2/packages/demos
etc.
where a bunch of related projects live top-level in a repo. Each project has a packages folder that includes the core implementation, as well as demos, framework-specific adaptors, etc.
In each package's package.json, I have a series of commands (convert the TS to JS, make a bundle, deploy to Firebase, etc.). Each command can depend on another, either in the same project or anywhere else in the file hierarchy.
This provides two benefits:
1. Iterating across packages is faster, because I don't have to worry about making sure each package rebuilds in the right order if I make a change in a library.
2. Filesystem concerns are separated: rollup only needs to worry about bundling, and it only needs to bundle web-facing projects. The only tool my libraries need is tsc.
(Before wireit, using TypeScript and Rollup together was a pain in the ass because you'd have to fiddle with picking the right TS plugin and configuring it. This was also often the long pole on doing a Rollup version upgrade. Decoupling the two makes Rollup way simpler/easier/nicer to use, which makes wireit awesome even if you don't have multiple packages.)
It's also a good replacement for lerna. Each of my packages has a publish command that runs `gitpkg publish`. My root package.json has a publish command that depends on all the packages' publish commands. Thus, I can run `yarn run publish` in the root of my monorepo and trust that all of my packages have been published to our git host appropriately. (gitpkg lets you turn a git host into a private registry, so you can share modules without setting up an NPM registry.)
Here's a snippet from one of my package.jsons. They basically all look like this. (start is complicated because of https://github.com/google/wireit/issues/33 https://github.com/google/wireit/issues/33. When that's resolved, it will be as simple as the others.)
"scripts": {
"start": "yarn run -TB concurrently \"yarn run build:tsc --watch\" \"rollup --config ./rollup.config.js --watch\" \"dhost site --bind-all\"",
"build": "yarn run -TB wireit",
"build:tsc": "yarn run -TB wireit",
"build:bundle": "yarn run -TB wireit",
"deploy": "yarn run -TB wireit"
},
"wireit": {
"build": {
"dependencies": [
"build:tsc",
"build:bundle"
]
},
"build:tsc": {
"command": "tsc --build --pretty",
"clean": "if-file-deleted",
"files": [
"src/**/*.{ts,tsx}",
"tsconfig.json",
"../../tsconfig.common.json"
],
"output": [
"dist/**",
".tsbuildinfo"
],
"packageLocks": [
"yarn.lock"
],
"dependencies": [
"../core:build",
"../preact:build"
]
},
"build:bundle": {
"command": "rollup --config ./rollup.config.js",
"clean": true,
"files": [
"dist/**/*.js",
"rollup.config.js"
],
"output": [
"site/mount.js",
".tsbuildinfo"
],
"packageLocks": [
"yarn.lock"
],
"dependencies": [
"build:tsc"
]
},
"deploy": {
"command": "firebase deploy",
"dependencies": [
"build:bundle"
]
}
},