The problem — Vite
I had a strange problem with Vite, Vue and TypeScript a while back.
Normally my Vue workflow went something like this:
npm run devto have a browser with hot-reloading next to my editor- Implement the story / fix I was working on
- Test & push for review
Now the error I kept having was when I pushed the code, my build pipeline kept failing, due to the fact that Vite does not run TypeScript’s compiler during dev and wasn’t catching any type errors that I made!
So the ‘official’ recommendation is to run tsc --noEmit --watch in a separate process. This works fine, but didn’t really solve my problem; instead of forgetting to run npm run build before deploying, I was now forgetting to run tsc while developing locally!
The solution — tmuxinator
I’m a big fan of unix and vim. Since I was already using tmux for window management, I wondered if there was a way to automate my tmux sessions. I found tmuxinator!
After reading the docs, all I had to do was create a new tmuxinator project with the panes that I required.
Now when I open my terminal, I type tmuxinator start proj_name. This opens three terminal panes:
- vim with my project open
npm run devtsc --noEmit --watchso I can see any TypeScript errors real-time!
This saved me lots of time by not relying so much on my build server to catch errors.
The broader lesson
Every project is different and my point is not to shill tmux/tmuxinator, but to remind you that whenever you notice certain patterns in your workflow, it could be worth automating.
The time spent setting up the automation is almost always recovered within a week. The real benefit is mental — you stop carrying cognitive load about remembering steps, and the process just runs.