Skip to content
This repository was archived by the owner on Mar 4, 2025. It is now read-only.
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
26 changes: 13 additions & 13 deletions CHANGELOG.md
Original file line number Diff line number Diff line change
Expand Up @@ -308,13 +308,13 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0

### Fixed

- Stylesheet filename fix https://github.com/archetype-themes/plugin-theme-component/pull/337
- Stylesheet filename fix https://github.com/archetype-themes/plugin-devkit/pull/337

## [2.3.0] — 2024-02-01

### Added

- Opinionated PostCSS Config https://github.com/archetype-themes/plugin-theme-component/pull/328
- Opinionated PostCSS Config https://github.com/archetype-themes/plugin-devkit/pull/328

## [2.2.0] — 2024-02-01

Expand Down Expand Up @@ -378,41 +378,41 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0

### Changed

- Drop package.json functions https://github.com/archetype-themes/plugin-theme-component/pull/299
- Drop package.json functions https://github.com/archetype-themes/plugin-devkit/pull/299
- archie name and executable renamed to "component" to match the plugin name.

### Fixed

- Repo paths fix https://github.com/archetype-themes/plugin-theme-component/pull/301
- Undefined content fix on builds with no styles https://github.com/archetype-themes/plugin-theme-component/pull/309
- Repo paths fix https://github.com/archetype-themes/plugin-devkit/pull/301
- Undefined content fix on builds with no styles https://github.com/archetype-themes/plugin-devkit/pull/309

## [1.9.7] — 2024-01-17

### Changed

- Update plugin's name https://github.com/archetype-themes/plugin-theme-component/pull/298
- Update plugin's name https://github.com/archetype-themes/plugin-devkit/pull/298

## [1.9.6] — 2024-01-16

### Changed

- Install collections defined via shopify.theme.toml https://github.com/archetype-themes/plugin-theme-component/pull/297
- Install collections defined via shopify.theme.toml https://github.com/archetype-themes/plugin-devkit/pull/297

## [1.9.5] — 2024-01-10

### Changed

- Handle shopify.theme.toml configuration file https://github.com/archetype-themes/plugin-theme-component/pull/291
- Handle shopify.theme.toml configuration file https://github.com/archetype-themes/plugin-devkit/pull/291

## [1.9.4] — 2024-01-08

### Added

- Shopify CLI plugin integration ([#272](https://github.com/archetype-themes/plugin-theme-component/pull/272))
- Shopify CLI plugin integration ([#272](https://github.com/archetype-themes/plugin-devkit/pull/272))

### Fixed

- Process locale files only ([#289](https://github.com/archetype-themes/plugin-theme-component/pull/289))
- Process locale files only ([#289](https://github.com/archetype-themes/plugin-devkit/pull/289))

## [1.9.3] — 2023-12-20

Expand Down Expand Up @@ -578,7 +578,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
### Fixed

- Fixed the computation of gitignore patterns during watch
mode ([#228](https://github.com/archetype-themes/plugin-theme-component/pull/228))
mode ([#228](https://github.com/archetype-themes/plugin-devkit/pull/228))

## [1.7.1] — 2023-10-31

Expand All @@ -590,7 +590,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0

### Added

- Import map processor ([#214](https://github.com/archetype-themes/plugin-theme-component/pull/214))
- Import map processor ([#214](https://github.com/archetype-themes/plugin-devkit/pull/214))

## [1.6.4]

Expand All @@ -614,7 +614,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0

### Fixed

- Fixed watch mode ([#215](https://github.com/archetype-themes/plugin-theme-component/issues/215))
- Fixed watch mode ([#215](https://github.com/archetype-themes/plugin-devkit/issues/215))

## [1.6.0] — 2023-10-12

Expand Down
17 changes: 7 additions & 10 deletions CONTRIBUTING.md
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ All contributions are welcome. To Contribute, create a branch, commit your code,
## Install the plugin

Make sure you have installed the [shopify CLI](https://shopify.dev/docs/api/shopify-cli) first. Then, checkout the code
from the [plugin-theme-component repository](https://github.com/archetype-themes/plugin-theme-component) and link your
from the [plugin-devkit repository](https://github.com/archetype-themes/plugin-devkit) and link your
local copy to your shopify CLI instance. Here's an example of what that can look like on macOS

```shell
Expand All @@ -15,10 +15,10 @@ brew install shopify-cli

# Checkout the repository in you projects folder, or any other location of your choice
cd ~/projects
git checkout https://github.com/archetype-themes/plugin-theme-component.git
git checkout https://github.com/archetype-themes/plugin-devkit.git

# Link your local copy to the shopify CLI
cd plugin-theme-component
cd plugin-devkit
shopify plugins link
```

Expand All @@ -28,16 +28,16 @@ Should you ever need to uninstall the plugin, use these commands

```shell
# From the project folder
cd ~/projects/plugin-theme-component
cd ~/projects/plugin-devkit
shopify plugins uninstall

# From anywhere
shopify plugins uninstall plugin-theme-component
shopify plugins uninstall plugin-devkit
```

## Contributing To The CLI's Development

You should consult the [Issues](https://github.com/archetype-themes/plugin-theme-component/issues) in GitHub. You will
You should consult the [Issues](https://github.com/archetype-themes/plugin-devkit/issues) in GitHub. You will
see unsolved issues. Feel free to tackle an existing issue, or create a new one if you need to.

Assign yourself an issue and reach out to us if you have questions. Create a branch for your development. Create a Pull
Expand Down Expand Up @@ -89,11 +89,8 @@ Contains additional documentation on components and the plugin's structure and b
Contains static assets used internally when generating a new component or when running the plugin's dev command with
setup files enabled.


### src folder



#### factory

Factories create component instances. When instantiating a component, a factory should load all necessary data from disk
Expand Down Expand Up @@ -152,6 +149,6 @@ Various utility methods organized by topic.
## Fixing Bugs

Check
the [bug issues panel](https://github.com/archetype-themes/plugin-theme-component/issues?q=is%3Aopen+is%3Aissue+label%3Abug)
the [bug issues panel](https://github.com/archetype-themes/plugin-devkit/issues?q=is%3Aopen+is%3Aissue+label%3Abug)
to view current bugs. Assign yourself one and create a branch for your fix. Create a Pull Request for your fix to be
merged into the main branch.
42 changes: 26 additions & 16 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,12 +1,12 @@
# Theme component plugin
# Devkit plugin

[![oclif](https://img.shields.io/badge/cli-oclif-brightgreen.svg)](https://oclif.io)
![Static Badge](https://img.shields.io/badge/Node.js-v18.12.0-blue)
[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)

A Shopify CLI plugin for building themes with Liquid theme components.

The `plugin-theme-component` repository is a foundational part of the [Archetype Devkit preview](https://github.com/archetype-themes/devkit).
The `plugin-devkit` repository is a foundational part of the [Archetype Devkit preview](https://github.com/archetype-themes/devkit).

## Getting Started

Expand All @@ -20,18 +20,26 @@ You'll need to ensure you have the following installed on your local development
### Installation

Install the Shopify CLI plugin:

```bash
shopify plugins install plugin-theme-component
shopify plugins install plugin-devkit
```


## List of commands

<!-- commands -->
- [`shopify theme component`](#shopify-theme-component)
- [`shopify theme component clean [THEMEDIR]`](#shopify-theme-component-clean-themedir)
- [`shopify theme component copy THEMEDIR`](#shopify-theme-component-copy-themedir)
- [`shopify theme component dev [COMPONENTSELECTOR]`](#shopify-theme-component-dev-componentselector)
- [`shopify theme component install THEMEDIR [COMPONENTSELECTOR]`](#shopify-theme-component-install-themedir-componentselector)
- [`shopify theme component map THEMEDIR [COMPONENTSELECTOR]`](#shopify-theme-component-map-themedir-componentselector)
- [`shopify theme generate import-map [THEMEDIR]`](#shopify-theme-generate-import-map-themedir)
- [`shopify theme generate template-map [THEMEDIR]`](#shopify-theme-generate-template-map-themedir)

## `shopify theme component`

Theme Component Plugin by Archetype Themes
Devkit Plugin by Archetype Themes

```
USAGE
Expand All @@ -44,7 +52,7 @@ DESCRIPTION
Theme Component Plugin by Archetype Themes
```

_See code: [src/commands/theme/component/index.ts](https://github.com/archetype-themes/plugin-theme-component/blob/v5.0.8/src/commands/theme/component/index.ts)_
_See code: [src/commands/theme/component/index.ts](https://github.com/archetype-themes/plugin-devkit/blob/v5.0.8/src/commands/theme/component/index.ts)_

## `shopify theme component clean [THEMEDIR]`

Expand All @@ -67,7 +75,7 @@ EXAMPLES
$ shopify theme component clean theme-directory
```

_See code: [src/commands/theme/component/clean.ts](https://github.com/archetype-themes/plugin-theme-component/blob/v5.0.8/src/commands/theme/component/clean.ts)_
_See code: [src/commands/theme/component/clean.ts](https://github.com/archetype-themes/plugin-devkit/blob/v5.0.8/src/commands/theme/component/clean.ts)_

## `shopify theme component copy THEMEDIR`

Expand All @@ -91,7 +99,7 @@ EXAMPLES
$ shopify theme component copy theme-directory
```

_See code: [src/commands/theme/component/copy.ts](https://github.com/archetype-themes/plugin-theme-component/blob/v5.0.8/src/commands/theme/component/copy.ts)_
_See code: [src/commands/theme/component/copy.ts](https://github.com/archetype-themes/plugin-devkit/blob/v5.0.8/src/commands/theme/component/copy.ts)_

## `shopify theme component dev [COMPONENTSELECTOR]`

Expand Down Expand Up @@ -137,7 +145,7 @@ EXAMPLES
$ shopify theme component dev header,footer,navigation
```

_See code: [src/commands/theme/component/dev.ts](https://github.com/archetype-themes/plugin-theme-component/blob/v5.0.8/src/commands/theme/component/dev.ts)_
_See code: [src/commands/theme/component/dev.ts](https://github.com/archetype-themes/plugin-devkit/blob/v5.0.8/src/commands/theme/component/dev.ts)_

## `shopify theme component install THEMEDIR [COMPONENTSELECTOR]`

Expand Down Expand Up @@ -166,7 +174,7 @@ EXAMPLES
$ shopify theme component install theme-directory header,footer,navigation
```

_See code: [src/commands/theme/component/install.ts](https://github.com/archetype-themes/plugin-theme-component/blob/v5.0.8/src/commands/theme/component/install.ts)_
_See code: [src/commands/theme/component/install.ts](https://github.com/archetype-themes/plugin-devkit/blob/v5.0.8/src/commands/theme/component/install.ts)_

## `shopify theme component map THEMEDIR [COMPONENTSELECTOR]`

Expand Down Expand Up @@ -197,7 +205,7 @@ EXAMPLES
$ shopify theme component map theme-directory header,footer,navigation
```

_See code: [src/commands/theme/component/map.ts](https://github.com/archetype-themes/plugin-theme-component/blob/v5.0.8/src/commands/theme/component/map.ts)_
_See code: [src/commands/theme/component/map.ts](https://github.com/archetype-themes/plugin-devkit/blob/v5.0.8/src/commands/theme/component/map.ts)_

## `shopify theme generate import-map [THEMEDIR]`

Expand All @@ -217,7 +225,7 @@ DESCRIPTION
Generate an import map for JavaScript files in the assets directory
```

_See code: [src/commands/theme/generate/import-map.ts](https://github.com/archetype-themes/plugin-theme-component/blob/v5.0.8/src/commands/theme/generate/import-map.ts)_
_See code: [src/commands/theme/generate/import-map.ts](https://github.com/archetype-themes/plugin-devkit/blob/v5.0.8/src/commands/theme/generate/import-map.ts)_

## `shopify theme generate template-map [THEMEDIR]`

Expand All @@ -237,22 +245,24 @@ DESCRIPTION
Generate a template map for component routes in the templates directory
```

_See code: [src/commands/theme/generate/template-map.ts](https://github.com/archetype-themes/plugin-theme-component/blob/v5.0.8/src/commands/theme/generate/template-map.ts)_
_See code: [src/commands/theme/generate/template-map.ts](https://github.com/archetype-themes/plugin-devkit/blob/v5.0.8/src/commands/theme/generate/template-map.ts)_

<!-- commandsstop -->

## Contributing

Interested in shaping the future of theme development with us? We welcome you to join our community! Your insights and discussions play a crucial role in our continuous improvement. We encourage you to start [discussions](https://github.com/archetype-themes/devkit/discussions), ask questions, and provide feedback on our component approach.

If you notice a bug, or want to contribute to the codebase, feel free to do so in the form of [creating an issue](https://github.com/archetype-themes/plugin-theme-component/issues/new/choose) or [pull request](https://github.com/archetype-themes/plugin-theme-component/pulls).
If you notice a bug, or want to contribute to the codebase, feel free to do so in the form of [creating an issue](https://github.com/archetype-themes/plugin-devkit/issues/new/choose) or [pull request](https://github.com/archetype-themes/plugin-devkit/pulls).

### Developing the plugin locally

If you already have the plugin installed via npm, you'll need to [uninstall](#uninstalling-the-plugin) the plugin before being able to develop the plugin locally.

Once this is done, follow these steps to ensure the Shopify CLI is running the local version of the plugin:
- `git clone https://github.com/archetype-themes/plugin-theme-component.git`
- `cd plugin-theme-component`

- `git clone https://github.com/archetype-themes/plugin-devkit.git`
- `cd plugin-devkit`
- `npm i`
- `npm run watch` or `npm run build`
- `shopify plugins link`
10 changes: 5 additions & 5 deletions package.json
Original file line number Diff line number Diff line change
@@ -1,11 +1,11 @@
{
"name": "plugin-theme-component",
"description": "Archetype Theme's Shopify CLI theme component plugin",
"name": "plugin-devkit",
"description": "Archetype Themes' Devkit plugin for Shopify CLI",
"version": "5.0.8",
"author": "Archetype Themes Limited Partnership",
"bin": {
"component": "bin/run.js",
"plugin-theme-component": "./bin/run.js"
"plugin-devkit": "./bin/run.js"
},
"type": "module",
"license": "MIT",
Expand All @@ -25,7 +25,7 @@
"/dist",
"/oclif.manifest.json"
],
"repository": "https://github.com/archetype-themes/plugin-theme-component.git",
"repository": "https://github.com/archetype-themes/plugin-devkit.git",
"dependencies": {
"@oclif/core": "^4",
"@oclif/plugin-help": "^6",
Expand Down Expand Up @@ -63,7 +63,7 @@
"main": "dist/index.js",
"oclif": {
"bin": "shopify",
"dirname": "plugin-theme-component",
"dirname": "plugin-devkit",
"commands": "./dist/commands",
"topicSeparator": " "
}
Expand Down
12 changes: 6 additions & 6 deletions src/commands/theme/component/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
import { Command, Flags } from '@oclif/core'

export default class Component extends Command {
static description = 'Theme Component Plugin by Archetype Themes'
static description = 'Devkit plugin by Archetype Themes'

static flags = {
version: Flags.boolean({
Expand All @@ -17,13 +17,13 @@ export default class Component extends Command {

if (flags.version) {
this.log(`\nShopify CLI Version: ${this.config.version}`)
const plugin = this.config.plugins.get('plugin-theme-component')
this.log(`Theme Component Plugin Version: ${plugin?.version ?? 'unknown'}`)
const plugin = this.config.plugins.get('plugin-devkit')
this.log(`Devkit plugin version: ${plugin?.version ?? 'unknown'}`)
} else {
this.log(
'\nWelcome To The Theme Component Plugin by Archetype Themes.' +
'\n\nUse the "--help" or "-h" flag to list available commands'
'\nWelcome to the Devkit plugin by Archetype Themes.' +
'\n\nUse the "--help" or "-h" flag to list available commands'
)
}
}
}
}
Loading