While it was built for Angular, it does support React projects as well.
I'm not sure if this will solve all of the problem above, but this is worth giving a shot.
I know what you mean about it being time consuming. I think I spent much more than a half a day...
But at least for my use case, a library of npm packages in Typescript, I either solved or didn't have most of the problems you mention.
Problem 1: I did have this one and your solution (not using parallel) was what I ended up with. Not sure if there's a better solution unless Lerna came up with an api that lets you scope packages in groups (with separate concurrency settings).
Problem 2: I ended up having Webpack handle Typescript and output as UMD in each of the packages. This works, but results in bigger bundles so I want try switching to using Babel.
Problem 3: didn't have this problem, probably because of Webpack. I use Jest (with ts-jest) without having to build first, in watch mode, etc. with no issues.
Problem 4: I did get Storybook working ok, but due to some unrelated issues with data I opted to roll my own demo app. I can't remember if it had the cli vs browser issue with type errors, it might have.
One issue I do have that I haven't solved is hot module replacement. I didn't put much time into it, but wasn't able to get it working with my setup. Standard reload does work at least.
Honestly, I agree it would be nice if this could all get simpler. But I'm excited that it's possible. Aside from UI libraries it's a great way to share isomorphic code, common code between React Native and a web app, etc. Not to mention the disk space savings. For me, I see it as one of those things that's a bit rough on the edges now but will hopefully improve with time.
I would take this repo for a grain of salt, as it's my first attempt at a monorepo (and some things like name choices were done pretty hastily): github.com/unleashit/npm-library
I'm in the middle of working through some of the same problems. Here's the repo:
For problem #2: I'm using Rollup to build the packages, and it has been very painless so far. This was a helpful article: email@example.com/how-to-publish...
This is how I solved problem #2 github.com/stereobooster/typescrip...
You claim to "appreciate convention over configuration" but you are trying to accomplish a very "unconventional" setup. Doesn't make sense
What is your suggestion for a more conventional approach?
You might want to take a look at Apollo monorepo setup: github.com/apollographql/apollo-se....
In particular, you can address "problem 1" by adding "composite": true and "references" to tsconfig.json in packages, so Typescript compiler will take care of building in the right order. This requires Typescript 3.0+ (typescriptlang.org/docs/handbook/p...).
Problem 2 will go away if you use different tsconfig for testing.
Yep, people already point this out github.com/stereobooster/typescrip.... All problems resolved.
Problem 2 can't be solved gracefully with different config, because we need to run build before running tests, so it will get confusing. Instead I added babel to process ES6 modules
thanks for this article! 👍
It helped me with a project. I created an account on dev.to solely to like your article and leave this comment!
Thanks. Yes, it took some time (more than I expected). When I initially shared the project I didn't have all the process. Community helped to figure out some questions.
To be fair it is unstable - in my current project TypeScript errors don't show up in Storybook :facepalm: (but they did before)
Great read. Where I've got the wall personally is with sass modules.
I've ended up with huge webpack bundles. That's hardly developer friendly.
We're a place where coders share, stay up-to-date and grow their careers.
We strive for transparency and don't collect excess data.