Problem 1: Customer SPA not loading (stuck on 'Loading...')
Root Cause: Missing type='module' attribute on customer SPA script tag
Solution: Added script_loader_tag filter to inject type='module' for ES modules
Problem 2: Production zip too large (21-41MB)
Root Cause: Build script included unnecessary files (dist folder, fonts, .vite, test files, archives)
Solution:
- Exclude entire customer-spa and admin-spa directories from rsync
- Manually copy only app.js and app.css for both SPAs
- Exclude dist/, archive/, test-*.php, check-*.php files
- Simplified Frontend/Assets.php to always load app.js/app.css directly (no manifest needed)
Changes:
- includes/Frontend/Assets.php:
* Added type='module' to customer SPA script (both manifest and fallback paths)
* Removed manifest logic, always load app.js and app.css directly
- build-production.sh:
* Exclude customer-spa and admin-spa directories completely
* Manually copy only dist/app.js and dist/app.css
* Exclude dist/, archive/, test files
Result:
✅ Customer SPA loads with type='module' support
✅ Production zip reduced from 21-41MB to 1.6MB
✅ Only essential files included (app.js + app.css for both SPAs)
✅ Clean production package without dev artifacts
Package contents:
- Customer SPA: 480K (app.js) + 52K (app.css) = 532K
- Admin SPA: 2.6M (app.js) + 76K (app.css) = 2.7M
- PHP Backend: ~500K
- Total: 1.6M (compressed)
Problem: Production zip was only 692K instead of expected 2.5MB+
Root Cause: Global --exclude='dist' was removing SPA build folders
Solution:
- Removed global dist exclusion
- Added specific exclusions for dev config files:
- tailwind.config.js/cjs
- postcss.config.js/cjs
- .eslintrc.cjs
- components.json
- .cert directory
Result:
✅ Production zip now 5.2M (correct size)
✅ Customer SPA dist included (480K)
✅ Admin SPA dist included (2.6M)
✅ No dev config files in package
Verified:
- Activation hook creates pages with correct shortcodes:
- [woonoow_shop]
- [woonoow_cart]
- [woonoow_checkout]
- [woonoow_account]
- Installer reuses existing WooCommerce pages if available
- Sets WooCommerce HPOS enabled on activation
Created build-production.sh to package plugin for production deployment.
Features:
- Verifies production builds exist for both SPAs
- Uses rsync to copy files with smart exclusions
- Excludes dev files (node_modules, src, config files, examples, etc.)
- Includes only production dist folders
- Creates timestamped zip file in dist/ directory
- Shows file sizes for verification
- Auto-cleanup of build directory
Usage: ./build-production.sh
Output: dist/woonoow-{version}-{timestamp}.zip
Current build: woonoow-0.1.0-20251230_171321.zip (692K)
- Customer SPA: 480K
- Admin SPA: 2.6M
