@pixelcabin/hatchet

Hatchet

Hatchet is a CLI tool built to help us work better with Shopify on the front-end at Pixelcabin.

Installation

Use the package manager npm to install Hatchet.

npm install @pixelcabin/hatchet [Add the "--global" flag to make it available everywhere]

Usage

Run hatchet --help to see the following output. Each subcommand has its own help information as well.

Usage: hatchet [options] [command]

A command line tool for Pixelcabin's front-end team 🪓

Options:
  -V, --version   output the version number
  -h, --help      display help for command

Commands:
  view            Open a theme in the browser
  upload          Upload files to Shopify
  change-theme    Change the theme that hatchet syncs with
  lint-js         Lint the JS in a project
  help [command]  display help for command

View

$ hatchet view

Usage: hatchet-view [options]

Options:
  -p, --path <path>  Go to a custom path like eg. /products/product-handle
  -m, --mobile       Generate a QR code rather than a new link
  -h, --help         display help for command

Upload

$ hatchet upload

Upload files to Shopify.

Usage: hatchet-upload [options]

Options:
  -j, --skip-json    Don't upload json
  -i, --skip-images  Don't upload images
  -f, --skip-fonts   Don't upload fonts
  -L, --liquid-only  Only upload liquid

Download

$ hatchet view

Open a theme in the browser or generate a QR code to open it on mobile easily.

Usage: hatchet-view [options]

Options:
  -p, --path <path>  Go to a custom path
  -m, --mobile       Generate a QR code that a mobile can scan to open the link

Change Theme

$ hatchet change-theme

Quickly change the theme your dev environment is pointing at.

Lint JS

$ hatchet lint-js

Lint the JS files in the project. Can be passed a glob, by default it will scan for all files in src/js/ and subfolders. It loads the default Pixelcabin .eslintrc.json which includes prettier and Vue plugins, and will also merge in an eslint config file if it exists in the project, as well as an .eslintigore.

Usage: hatchet-lint-js "glob/**"

Options:
  -f, --fix   Autoformat source files
  -h, --help  display help for command

Coming soon

• JS compilation
• JS linting
• SCSS compilation
• SCSS linting
• Watcher task that compiles and uploads
• Pull request helper

Contributing

Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change.

License

GNU GPLv3