woocommerce/packages/js/create-woo-extension/zh-cn

@woocommerce/create-woo-extension

Create Woo Extension 为集成 WooCommerce 搭建了一个功能齐全的现代开发环境。使用它来构建充分利用 WooCommerce 强大功能的扩展。

免配置

构建工具已预先配置完毕，开始开发现代 JavaScript 屏幕无需额外努力。Create Woo Extension 添加了一个与 WooCommerce 管理员集成的 React 页面。同时包含 PHP 和 JavaScript 单元测试、代码检查，以及针对 WooCommerce 和 WordPress 的 Prettier IDE 配置。

在您偏好的环境设置中添加项目，或使用内置的 wp-env 轻松设置本地 WordPress 环境，用于构建和测试插件与主题。wp-env 已配置为加载最新版 WooCommerce，只需一条命令即可轻松开始开发。

用法

npx @wordpress/create-block -t @woocommerce/create-woo-extension my-extension-name

进入新创建的文件夹并开始。

cd my-extension-name
npm run start # 监视 JavaScript 的更改

# 使用 wp-env 进行本地开发（可选）
npm -g i @wordpress/env # 如果您还没有安装 wp-env
wp-env start # 启动 WordPress 环境

从 WordPress 插件页面查看新激活的插件，并导航到 wp-admin/admin.php?page=wc-admin&path=%2Fmy-extension-name 来检查它。

变体

您还可以通过指定变体来创建不同类型的 WooCommerce 扩展。

npx @wordpress/create-block -t @woocommerce/create-woo-extension --variant=add-report my-extension-name

分析报告变体

这些变体用于创建修改 WooCommerce 分析页面的示例扩展。

• add-report - 在分析菜单下创建新的示例报告页面。
• dashboard-section - 在分析概览区域添加自定义部分。
• sql-modification - 为产品分析报告中的 SQL 语句添加自定义下拉过滤器。更多信息请参阅扩展 WooCommerce 分析报告教程。
• table-column - 为产品分析报告添加新列。

入门体验变体

这些变体为修改 WooCommerce 入门体验创建示例扩展。

• add-task - 为入门任务列表创建自定义任务。更多信息请参阅处理商家入门教程。

开发

要为该工具本身进行开发，您也可以从本地目录安装。

npx @wordpress/create-block -t ./path/to/woocommerce/packages/js/create-woo-extension my-extension-name

这是一个与 @wordpress/create-block 一起使用的模板，用于创建 WooCommerce 扩展的起点。