Loading…
From Ruby to Node: Overhauling Shopify’s CLI for a Better Developer Experience
2023-10-18
- Source
- Shopify
- Published
- Added to Yomu
Summary
Shopify rewrote its unified CLI from Ruby to TypeScript running on Node after growing dependencies on Node tooling, Hydrogen’s preference for npm-managed dependencies, and a broader fit with web technologies. The rewrite aims to reduce system requirements, improve terminal consistency, and make contribution easier, while using a modular architecture of domain NPM packages built on @shopify/cli-kit. The team established shared code, UI, convention, and principle foundations, addressed cross-OS support, used TypeScript for stronger contracts, and applied Cucumber for end-to-end testing. The Node CLI unified and streamlined app development and added extensibility such as functions, but Theme commands still use Ruby and removing that dependency remains future work.
Context
The Ruby-based CLI had become less consistent for developers as Shopify added Theme, App, Hydrogen, and UI-extension workflows. Its Node tooling dependencies increased system requirements, while Hydrogen developers expected npm install to provide project dependencies without a separate Ruby runtime. A separate Hydrogen CLI could also have undermined the effort to provide one consistent CLI across the platform.
Approach / What changed
Shopify rewrote the CLI in TypeScript for Node, organizing platform domains into NPM packages built on the shared @shopify/cli-kit foundation. The team added shared code and UI patterns, conventions, principles, static analysis rules, cross-OS support practices, TypeScript typing, Cucumber end-to-end tests, and an oclif-based plugin architecture. Theme commands still use the Ruby implementation while the team works to remove that dependency.
Takeaways
- Node’s module system supports multiple versions of the same transitive package, enabling modular domain packages without the conflicts Shopify associated with Ruby’s approach.
- The shared @shopify/cli-kit package, Ink-based UI components, conventions, and custom ESLint rules were used to align contributions and create consistent command experiences.
- Oclif supplied declarative command APIs, generated help documentation, a plugin system, and hooks that helped keep CLI foundations separate from App, Theme, and Hydrogen plugins.