shopify-cli-extender-mellenger

A lightweight npm/yarn plugin that allows you to run Shopify CLI commands directly through your package scripts. This plugin makes it easy to create shortcuts for common Shopify development tasks and supports environment variables through .env files.

Installation

# Using yarn
yarn add shopify-cli-extender-mellenger

# Using npm
npm install shopify-cli-extender-mellenger

Project Setup

1. Create a .env file

Create a .env file in your project root with your environment variables:

# Required
SHOPIFY_STORE=your-store
SHOPIFY_STAGING_THEME_ID=123456789

# Optional
SHOPIFY_SRC_THEME_FOLDER=./src
SHOPIFY_DIST_THEME_FOLDER=./dist
SHOPIFY_WATCH_PORT=9393

2. Run a commands

# Using yarn
yarn shopify-mellenger dev
yarn shopify-mellenger json-pull-staging

# Using npm
npm run shopify-mellenger dev
npm run shopify-mellenger json-pull-staging

These variables will be automatically used in the predefined commands.

Recommended usage

In this example usage, we compile the theme and push the changes to a sandboxed dev theme.

  ..., // The rest of your package.json
  "scripts": {
    "watch": "webpack --watch --node-env=production",
    "dev": "yarn watch & shopify-mellenger dev"
  }

Predefined Commands

The following commands are available out of the box:

| Command | Action | |---------|-------------------| | dev | Compile theme + work in a sandboxed development theme. | | staging | Compile theme + work in on your staging theme. | | share | Push your current theme to your store in a new theme. | | push | Push theme + config up to your store. You will be asked to choose a theme. | | pull | Pull codebase + config up to your store. You will be asked to choose a theme. | | pull-staging | Pull codebase + config from your staging theme. | | codebase-push | Push codebase up to your store. You will be asked to choose a theme. | | codebase-push-staging | Push codebase up to your store's staging theme. | | codebase-pull | Pull codebase from your staging theme. JSON will be ignored. | | codebase-pull-staging | Pull codebase from your staging theme. JSON will be ignored. You will be asked to choose a theme. | | json-pull | Pull config your store theme. You will be asked to choose a theme. | | json-pull-staging | Pull config from your staging theme. |

Predefined Flags

| Flag | Action | |---------|-------------------| | -h or --help | Get tips and tricks on how the command line works. | | --env=.env.ca | Define a different .env file. Defaults to .env. |

Customizing Commands

You can customize or add new commands in two ways:

Your custom commands will be merged with the default commands. If you define a command with the same name as a default command, your definition will override the default.

Command Configuration

Define your custom Shopify CLI commands in the shopifyMellengerCommands section of your package.json. Each command consists of a name and the corresponding Shopify CLI command:

"shopifyMellengerCommands": {
  "my-new-shiny-commany": "shopify theme dev --theme=${SHOPIFY_STAGING_THEME_ID}",
}

Example Configuration

"shopifyMellengerCommands": {
  "my-new-shiny-commany": "shopify theme dev --theme=${SHOPIFY_STAGING_THEME_ID}",
}

Environment Variables

The plugin supports environment variables in your commands. You can use them in two formats:

• ${VARIABLE_NAME} - Recommended format
• $VARIABLE_NAME - Alternative format

All environment variables from your .env file are available to your commands.

Features

• Run Shopify CLI commands with simple npm/yarn commands
• Support for environment variables from .env files
• Customizable command mapping in your package.json
• Helpful error messages and command suggestions
• Automatic variable substitution in your commands

Prerequisites

• Node.js (v12 or later)
• npm or yarn
• Shopify CLI installed globally

Troubleshooting

If you encounter any issues:

1. Ensure Shopify CLI is installed globally:

   npm install -g @shopify/cli @shopify/theme

2. Check your .env file has the correct variables

3. Verify your package.json has the correct configuration

License

MIT

Contributing

Feel free to submit issues or pull requests to improve this plugin.

Development

To work on and test this project, use terminal to enter a Shopify repo and run the library. Please make sure Shopify CLI is installed globally first.

# If it's not installed
npm install -g @shopify/cli@latest

# Enter your repo
cd my-sample-shopify-store-repo

# Run the CLI extender by referring back to this folder
node ../shopify-cli-extender-mellenger/index.js --help
node ../shopify-cli-extender-mellenger/index.js dev