woocommerce/.ai/skills/woocommerce-email-editor/zh-cn/SKILL.md

name	description
woocommerce-email-editor	Setup and develop the WooCommerce block email editor. Use when working on email templates, transactional emails, or the email editor feature.

WooCommerce 电子邮件编辑器开发

此技能为开发 WooCommerce 区块电子邮件编辑器提供指导。

何时使用此技能

在以下情况下调用此技能：

• 为电子邮件编辑器设置本地开发环境
• 处理电子邮件模板或交易电子邮件
• 修改电子邮件编辑器的 PHP 或 JS 包
• 测试电子邮件发送功能

开发环境设置

1. 启动 WooCommerce wp-env

pnpm --filter=@woocommerce/plugin-woocommerce -- wp-env start

站点默认运行在 http://localhost:8888。如果端口 8888 不可用，wp-env 会分配一个不同的端口。检查启动输出或运行 wp-env info 来查看您的实际网址。

2. 启动监听器

监听并构建管理员 JS 文件（包括电子邮件编辑 JS 包），并同步电子邮件编辑 PHP 包的更改：

pnpm --filter=@woocommerce/plugin-woocommerce watch:build:admin

3. 启用区块电子邮件编辑功能

访问 http://localhost:8888/wp-admin/admin.php?page=wc-settings&tab=advanced&section=features 并启用区块电子邮件编辑器。

4. 编辑交易电子邮件

访问 http://localhost:8888/wp-admin/admin.php?page=wc-settings&tab=email

使用 Mailpit 进行邮件测试

要在本地测试邮件发送，请使用 Mailpit 作为本地 SMTP 服务器。

配置 SMTP

添加到 plugins/woocommerce/.wp-env.override.json：

{
    "lifecycleScripts": {
        "afterStart": "./tests/e2e-pw/bin/test-env-setup.sh && wp-env run cli wp plugin install wp-mail-smtp --activate"
    },
    "config": {
        "WPMS_ON": true,
        "WPMS_MAILER": "smtp",
        "WPMS_SMTP_HOST": "host.docker.internal",
        "WPMS_SMTP_PORT": "1025",
        "WPMS_SMTP_AUTH": false,
        "WPMS_SMTP_SECURE": ""
    }
}

开始 Mailpit

docker run --rm --name=mailpit -p 1025:1025 -p 8025:8025 -d axllent/mailpit

或如果容器已存在：

docker start mailpit

查看电子邮件

打开 http://localhost:8025 以查看捕获的电子邮件。

重启 wp-env

创建或修改 .wp-env.override.json 后，重启环境：

pnpm --filter=@woocommerce/plugin-woocommerce -- wp-env start --update

关键路径

路径	描述
packages/php/email-editor/	电子邮件编辑 PHP 包
packages/js/email-editor/	电子邮件编辑 JS 包
plugins/woocommerce/.wp-env.override.json	本地 wp-env 配置（git 忽略）

构建电子邮件编辑包

更改后重新构建 JS 包：

pnpm --filter=@woocommerce/email-editor build

测试 PHP 包

从 packages/php/email-editor/ 目录运行测试。

设置

cd packages/php/email-editor
wp-env start
composer dump-autoload

运行集成测试

wp-env run tests-cli --env-cwd=wp-content/plugins/email-editor ./vendor/bin/phpunit --configuration phpunit-integration.xml.dist

运行特定测试

wp-env run tests-cli --env-cwd=wp-content/plugins/email-editor ./vendor/bin/phpunit --configuration phpunit-integration.xml.dist --filter Table_Test

对 PHP 包进行代码检查

从 packages/php/email-editor/ 目录运行。

PHPStan

cd tasks/phpstan && ./run-phpstan.sh

为 PHP 7 兼容性：

cd tasks/phpstan && ./run-phpstan.sh php7

PHPCS

composer run phpcs