mcpField
W
woocommerce-local-env

woocommerce-local-env

github.com/woocommerce開発10.6k90 回インストール今日更新
リポジトリ

woocommerce-local-env について

wp-env を使って WooCommerce Core をローカル実行するためのスキルです。環境設定、起動管理、ビルド監視、動作確認、トラブルシューティングを案内し、エージェントが実行する作業とユーザー管理の長時間監視を区別します。

主な機能

  1. 01wp-env の起動・停止・再起動
  2. 02必要に応じた依存関係のインストール
  3. 03全体または対象別のビルド監視
  4. 04前提条件とサイト応答の確認
  5. 05Docker と更新されないアセットの問題解決

活用シーン

  1. 01WooCommerce Core のローカル開発環境の構築
  2. 02対象を絞った変更時のアセット再ビルド
  3. 03ローカルサイトの応答確認

インストール

コマンドをコピーしてターミナルで実行します。

$npx skills add https://github.com/woocommerce/woocommerce --skill woocommerce-local-env

インストール後、Claude Code で/woocommerce-local-envを入力して読み込まれたか確認します。

詳細

WooCommerce ローカル環境

概要

plugins/woocommerce/README.md と .wp-env.json を読み直さずに、WooCommerce Core をローカルで起動するには、このスキルを使用します。

ルートに短いスクリプトがある場合は、そちらを優先してください。エイリアスが利用できない場合は、パッケージのコマンドを絞り込んで実行してください。

プロセスの所有者

コマンドを実行するか、ユーザーに実行を依頼するかを決めるときは、次の所有権モデルを使用してください。

  • タスクに役立つ場合は、セットアップの確認、依存関係のインストール、単発のビルド、wp-env の起動・停止コマンドをエージェントが実行します。これらのコマンドは完了後、制御が戻る必要があります。
  • watch:* コマンドは、ユーザーが所有する長時間実行プロセスとして扱います。アクティブな確認のために短時間だけ一時的にウォッチャーを実行する必要がある場合を除き、ユーザーには別のターミナルで関連するウォッチャーを実行するよう伝えてください。
  • 可能であれば、すでに実行中の環境を再利用してください。
  • 作業を終える前に、エージェントが所有する長時間実行セッションを停止するか、クリーンアップしてください。

クイックコマンド

リポジトリのルートから実行してください。

# Start the wp-env development environment at http://localhost:8888/.
pnpm wc:env

# Stop or restart wp-env.
pnpm wc:env:stop
pnpm wc:env:restart

# Watch all WooCommerce Core build outputs.
pnpm wc:watch

# Watch targeted build outputs.
pnpm wc:watch:admin
pnpm wc:watch:blocks
pnpm wc:watch:classic-assets

# Build all or targeted outputs once.
pnpm wc:build
pnpm wc:build:admin
pnpm wc:build:blocks
pnpm wc:build:classic-assets

pnpm wc:env:restart は wp-env コンテナーを削除して再作成するため、環境をクリーンな状態で再起動する場合にのみ使用してください。

WooCommerce パッケージから実行する代替コマンド:

pnpm --filter='@woocommerce/plugin-woocommerce' env:dev
pnpm --filter='@woocommerce/plugin-woocommerce' env:stop
pnpm --filter='@woocommerce/plugin-woocommerce' env:restart
pnpm --filter='@woocommerce/plugin-woocommerce' build
pnpm --filter='@woocommerce/plugin-woocommerce' watch:build
pnpm --filter='@woocommerce/plugin-woocommerce' watch:build:admin
pnpm --filter='@woocommerce/plugin-woocommerce' watch:build:blocks
pnpm --filter='@woocommerce/plugin-woocommerce' watch:build:classic-assets

plugins/woocommerce/ から、たとえば pnpm env:dev や pnpm watch:build のように、パッケージスクリプトを直接実行してください。

セットアップのワークフロー

  1. セットアップに失敗した場合、またはユーザーが初回セットアップを求めている場合は、前提条件を確認します。

    node --version
    pnpm --version
    php --version
    composer --version
    docker --version
    docker info
    
  2. 依存関係が不足しているか古くなっている場合に限り、リポジトリのルートから依存関係をインストールします。

    pnpm install
    
  3. 環境を起動します。

    pnpm wc:env
    
  4. フロントエンドやアセットの変更をリアルタイムでビルドする必要がある場合は、別のターミナルでウォッチャーを起動するようユーザーに伝えます。

    pnpm wc:watch
    

ノイズや起動時間を抑えるため、対象を絞った作業では、対象を絞ったウォッチャーを推奨してください。

  • 管理画面クライアント:pnpm wc:watch:admin
  • Blocks クライアント:pnpm wc:watch:blocks
  • クラシックアセット:pnpm wc:watch:classic-assets

環境の詳細

  • 開発 URL:http://localhost:8888/
  • テスト環境のポート:8086
  • wp-env の設定:plugins/woocommerce/.wp-env.json
  • wp-env の PHP バージョン:8.1
  • WooCommerce パッケージ:@woocommerce/plugin-woocommerce
  • README のソース:plugins/woocommerce/README.md

検証

wp-env の起動後、サイトが応答することを確認します。

curl -I http://localhost:8888/

ブラウザーで検証するには、ユーザーがローカルサイトの確認やテストを求めている場合に、Browser プラグインで http://localhost:8888/ を開きます。

トラブルシューティング

  • docker info が失敗した場合は、Docker Desktop を起動してから再試行するようユーザーに依頼してください。
  • 依存関係の変更後に pnpm wc:env が失敗した場合は、pnpm install を実行してから再試行してください。
  • wp-env コンテナーが古い状態に見える場合は、環境の破壊的なリセットを行ってよいことを確認してから、pnpm wc:env:restart を実行してください。
  • アセットが更新されない場合は、関連するウォッチャーが実行中であることを確認し、変更箇所に対象を絞ったウォッチャーを使用してください。
  • ユーザーが PHP のユニットテストだけを必要としている場合は、woocommerce-dev-cycle のテストコマンドを優先してください。必要がない限り、ブラウザーを使う一連のワークフローは開始しないでください。

コメント