wp-build-tools

Solid

Use when setting up, configuring, or debugging the JavaScript/CSS build pipeline for a WordPress plugin — @wordpress/scripts, webpack (webpack.config.js, entry points, externals), Vite, block editor asset compilation with block.json, enqueueing built assets with .asset.php dependency files, wp_enqueue_script / wp_localize_script, Sass/SCSS/PostCSS compilation, TypeScript support, register_block_type, or reusing a JS/CSS library already bundled by a host plugin (EDD, WooCommerce, Elementor). Triggers: "npm run build fails", "webpack config error", "my script is not loading", "set up @wordpress/scripts", "enqueue my block assets", "why is my CSS not compiling", ".asset.php not found", "how do I reuse this bundled library", "TypeScript in a WP plugin", "block.json attributes", "missing dependency in build", "wp_enqueue_script not loading", "externals in webpack", "Vite for WordPress", "Sass not compiling", "PostCSS setup", "build output is in the wrong folder", "npm ci vs npm install", "externalize React from my

Web & Frontend 26 stars 3 forks Updated 1 weeks ago MIT

Install

View on GitHub

Quality Score: 80/100

Stars 20%
48
Recency 20%
90
Frontmatter 20%
70
Documentation 15%
100
Issue Health 10%
80
License 10%
100
Description 5%
100

Skill Content

# WordPress Plugin Build Tools > **Model note:** Config setup and `.asset.php` enqueue patterns are mechanical — `haiku` covers most cases. Debugging webpack entry-point conflicts or reusing a dependency plugin's bundled library may need `sonnet`. Configure and operate the JS/CSS build pipeline for WordPress plugins: `@wordpress/scripts` (webpack-based), Vite alternative, asset manifest handling, and correct enqueuing with the generated `.asset.php` dependency file. ## When to use - "Set up `@wordpress/scripts`", "configure webpack for my plugin". - "Build blocks and admin scripts", "compile Sass for a plugin". - "Why isn't my JS loading?", "fix asset enqueue with versioned hash". - "Switch from @wordpress/scripts to Vite". - "Set up separate entry points for front-end vs admin vs block editor". **Not for:** Block registration, `block.json` structure, or Gutenberg API — use the official `wp-block-development` skill. PHP-side REST API — use `wp-rest-api`. ## Method ### 1. Install @wordpress/scripts ```bash npm install --save-dev @wordpress/scripts ``` **`package.json`:** ```json { "scripts": { "build": "wp-scripts build", "start": "wp-scripts start", "lint:js": "wp-scripts lint-js", "lint:css": "wp-scripts lint-style" } } ``` Default entry point: `src/index.js` → `build/index.js` + `build/index.asset.php`. ### 2. Multiple entry points Create `webpack.config.js` at plugin root to override the default entry: ```js const defaultConfig = requir...

Details

Author
mralaminahamed
Repository
mralaminahamed/wp-dev-skills
Created
1 months ago
Last Updated
1 weeks ago
Language
PHP
License
MIT

Integrates with

Similar Skills

Semantically similar based on skill content — not just same category

Web & Frontend Listed

wp-builder-pro

This skill should be used when the user asks to "build a WordPress theme", "add a feature to an existing plugin", "add a settings page to a plugin", "extend an existing WordPress plugin", "create or register a single Gutenberg block or pattern", "extend WooCommerce", "add a WordPress REST API endpoint", "work with ACF fields", "add a nonce to an admin form", "harden a WordPress plugin", "speed up a slow WordPress site", or invokes /wp-builder-pro. Also triggers on symptom-driven requests - "my WordPress site is slow", "a plugin throws a fatal error", "a block won't render", "fix my WordPress site". Operates as an expert WordPress developer building custom themes, plugins, Gutenberg blocks, WooCommerce extensions, and REST endpoints, applying security hardening (nonces, sanitization, escaping, capability checks, prepared statements) and performance tuning (transients, object cache, query optimization, conditional asset enqueueing) to WordPress Coding Standards. Routes each request to the matching reference (th

2 Updated 2 days ago
chrismccoy
Testing & QA Solid

wp-plugin-testing

Use when writing or setting up tests for a WordPress plugin — PHPUnit integration tests using WP_UnitTestCase with the WP test suite (bin/install-wp-tests.sh, phpunit.xml.dist, tests/bootstrap.php), unit tests with Brain Monkey (when() / expect() / Mockery) or WP_Mock, test factories (factory()->post->create(), ->user->create(), ->term->create()), HTTP request mocking with add_filter pre_http_request, AJAX testing with WP_Ajax_UnitTestCase, redirect/exit testing via exception-throwing pattern, multisite tests (WP_MULTISITE=1), acceptance tests with Codeception + wp-browser, or GitHub Actions CI matrix for PHP x WP versions. Triggers: "write a test for this", "unit test this function", "set up PHPUnit for my plugin", "mock this WP function", "Brain Monkey setup", "WP_Mock", "test is failing", "how do I test a hook", "test my REST endpoint", "factory()->post->create()", "install the WP test suite", "test my wp_mail call", "integration test setup", "bin/install-wp-tests.sh", "phpunit.xml.dist", "WP_UnitTestCase"

26 Updated 1 weeks ago
mralaminahamed
Data & Documents Listed

speckit.wordpress

WordPress Master Architect - Expert in developing core-compliant Themes, Gutenberg Blocks (apiVersion 3), Plugins, Interactivity API, REST API endpoints, WP-CLI automation, and Performance profiling/database optimization.

2 Updated today
wedabro