# CLI 快速开始

Shoplazza CLI 是帮助您构建 Shoplazza theme 的命令行工具，支持在本地开发时预览、测试和共享 theme 变更。

本教程用一套 CLI 流程覆盖两种场景：从参考主题创建全新 theme，以及自定义现有商家 theme。在第二步选择适合您目标的路径，其余步骤通用。

## 您将学到什么

完成本教程后，您将实现以下目标：

*   搭建本地开发环境
*   获取 theme 代码：克隆 [Nova 2023](/zh-CN/docs/theme/developer-tools/nova-2023) 或下载商家 theme
*   使用商店真实数据预览您的修改
*   将 theme 代码推送至商店并发布

## 前置要求

*   您要操作的商店 URL，例如 `your-store.myshoplaza.com`。

### 安装 Shoplazza CLI 的系统要求

安装和运行 Shoplazza CLI 的要求取决于您的操作系统：

*   [Node.js](https://nodejs.org/en/) 18.0.0 或更高版本
*   [Git](https://git-scm.com/downloads)

## 流程概览

## 第一步：安装 Shoplazza CLI

请按照以下说明在 macOS、Windows 或 Linux 上安装 Shoplazza CLI。

**终端**

```shell
npm install -g shoplazza-cli
```

## 第二步：获取 theme 代码

选择与您目标匹配的路径。

### 方式 A：创建新主题

使用 [shoplazza themes init](/zh-CN/docs/theme/developer-tools/shoplazza-cli/theme-commands#init) 将 Nova 2023 Git 仓库克隆到本地。

1.  在终端中，导航到您想克隆 Nova 2023 的工作目录。
2.  输入以下命令：

**终端**

```shell
shoplazza themes init --name my-theme
```

3.  theme 会被克隆到 `my-theme` 文件夹中。进入该文件夹：

**终端**

```shell
cd my-theme
```

初始化 theme 后，运行 [shoplazza auth login](/zh-CN/docs/theme/developer-tools/shoplazza-cli/theme-commands#login) 以您的商店账号登录。

1.  输入以下命令：

**终端**

```shell
shoplazza auth login --store-domain my-store.myshoplaza.com
```

2.  浏览器会自动打开授权登录页面，点击**授权登录**。
3.  授权成功后，页面会显示授权成功提示：

![](https://cnres.appracle.com/86c0ed089be8e0d3a93f4478d8a50a85.png)

### 方式 B：自定义现有商家主题

**前置条件**

在执行 pull 和登录之前，您需要先申请访问商家商店。在商家商店中操作 theme，可以使用商家的真实商品和其他资源进行测试。您也可以通过其他账号和凭证访问 theme。[了解更多](/zh-CN/docs/theme/developer-tools/shoplazza-cli/#%E8%AE%A4%E8%AF%81)

如果本地没有 theme，需要先下载一份 theme 代码副本以便在本地操作。

1.  先运行 `shoplazza themes list --format table` 查看商店中的主题 ID，然后拉取目标主题：

**终端**

```shell
shoplazza themes pull --theme-id <THEME_ID>
```

2.  theme 内容会下载到当前文件夹。

**提示**

执行前请确保已登录（`shoplazza auth login --store-domain <domain>`），且账号有目标商店的访问权限。如需切换账号，先运行 `shoplazza auth logout`。

下载商家 theme 后，您可以对 theme 代码进行任何必要的修改。例如，调整 theme 的 CSS 来改变其外观。

## 第三步：启动本地开发服务器

获取 theme 代码后，运行 [shoplazza themes serve](/zh-CN/docs/theme/developer-tools/shoplazza-cli/theme-commands#serve) 即可在浏览器中与 theme 进行交互。Shoplazza CLI 会将该 theme 作为[开发主题](/zh-CN/docs/theme/developer-tools/shoplazza-cli/#%E5%BC%80%E5%8F%91%E4%B8%BB%E9%A2%98)上传至您连接的商店。

该命令会返回一个 URL，支持对 CSS 和 section 的本地修改进行热重载，让您可以使用商店真实数据实时预览变更。此预览仅在 Google Chrome 中可用。

1.  运行以下命令以启动 theme 服务：

**终端**

```shell
shoplazza themes serve
```

2.  CLI 会上传 theme 并返回预览 URL 和主题编辑器链接。

3.  下图展示了使用 `serve` 命令启动开发服务器的状态：

![](https://cnres.appracle.com/b0692a14d95e470e350af68598b4bd0a.png)

**备注**

您也可以使用 `serve` 命令为开发主题生成预览链接以及[主题编辑器](/zh-CN/docs/theme/developer-tools/theme-editor)链接。

## 第四步：推送 theme

若您希望分享 theme 的永久链接、更新现有 theme 的代码，或为发布做准备，需要使用 [theme push](/zh-CN/docs/theme/developer-tools/shoplazza-cli/theme-commands#push) 命令将 theme 代码推送至 Shoplazza。

**终端**

```shell
shoplazza themes push --theme-id <THEME_ID>
```

## 第五步：发布 theme

若您希望让 theme 在商店中上线，可以使用 [theme publish](/zh-CN/docs/theme/developer-tools/shoplazza-cli/theme-commands#publish) 命令发布。在运行此命令前，请确保已通过 [theme push](/zh-CN/docs/theme/developer-tools/shoplazza-cli/theme-commands#push) 命令将所有本地修改推送至 Shoplazza。

1.  输入以下命令：

**终端**

```shell
shoplazza themes publish --id <THEME_ID>
```

指定的 theme 将被发布并成为商店的当前激活主题。

## 后续步骤

使用 Shoplazza CLI 创建或自定义 theme 只是构建 theme 的第一步。您可以继续探索以下方向：

### 深入了解 Shoplazza theme

*   **探索 theme 的架构。** 在我们的[架构文档](/zh-CN/docs/theme/architecture/overview)中深入了解 theme 的结构，以及每个文件和文件夹的作用。

### 实现功能

您可以为 theme 启用特定 Shoplazza 功能或添加新功能，功能分为以下几类：

*   [商品展示](/zh-CN/docs/theme/theme-features/product-merchandising/)
*   [站点导航与搜索](/zh-CN/docs/theme/theme-features/site-navigation-and-search/)
*   [搜索引擎优化](/zh-CN/docs/theme/theme-features/seo/)