P4RS3LT0NGV3/build/README.md

Build Scripts

Scripts

copy-static.js

Copies static files to dist/ directory

• Copies css/ directory to dist/css/
• Copies favicon.svg to dist/favicon.svg
• Copies js/ directory structure to dist/js/
• Generated files will be overwritten by subsequent build steps

npm run build:copy

build-transforms.js

Bundles all transformers from src/transformers/ into dist/js/bundles/transforms-bundle.js

• Automatically creates the dist/js/bundles/ directory if it doesn't exist
• Discovers all transformers from category directories
• Generates a single bundled file for browser use

npm run build:transforms

build-emoji-data.js

Fetches Unicode emoji data and generates dist/js/data/emojiData.js

• Automatically creates the dist/js/data/ directory if it doesn't exist
• Uses cached data if available (7-day cache)
• Merges keywords from src/emojiWordMap.js

npm run build:emoji

inject-tool-scripts.js

Auto-discovers tools in js/tools/ and:

• Generates script tags in index.template.html
• Generates auto-registration code in js/core/toolRegistry.js

npm run build:tools

inject-tool-templates.js

Injects tool templates from templates/ into dist/index.html

• Reads from index.template.html (source file)
• Outputs to dist/index.html (production file)

npm run build:templates

build-alphabet-transforms.js

Regenerates hand-maintained symbol alphabet files from data/alphabets/*.json into src/transformers/symbol/.

npm run build:alphabets

Runs automatically before build-transforms.js (npm run build:transforms).

build-code-vendor.js

Bundles QR and barcode libraries into js/vendor/ for the Codes tool (no CDN).

npm run build:codes-vendor

build-index.js

Generates src/transformers/index.js (Node/test import index).

npm run build:index

Build Pipeline

npm run build  # Runs all scripts in order:
# 1. build:tools         - Inject tool scripts into index.template.html + toolRegistry
# 2. build:codes-vendor  - Bundle qrcode, JsBarcode, ZXing → js/vendor/
# 3. build:copy          - Copy static files to dist/
# 4. build:index         - Generate src/transformers/index.js
# 5. build:transforms    - build:alphabets + bundle transformers → dist/js/bundles/
# 6. build:emoji         - Generate emoji data to dist/js/data/
# 7. build:templates     - Inject templates → dist/index.html

Output Structure

All production files are output to the dist/ directory:

dist/
├── index.html                    # Generated from index.template.html
├── favicon.svg                   # Copied from root
├── css/                          # Copied from root
│   ├── style.css
│   └── notification.css
└── js/                           # Copied from root, then generated files added
    ├── bundles/
    │   └── transforms-bundle.js  # Generated
    └── data/
        └── emojiData.js          # Generated

Development Workflow

• Edit transformers → npm run build:transforms
• Add new tool → npm run build:tools
• Edit templates → npm run build:templates
• Full rebuild → npm run build (outputs to dist/ folder)

Production Deployment

The dist/ folder contains all files needed for production deployment. This folder is:

• Generated by the build process
• Ignored by git (see .gitignore)
• Uploaded to GitHub Pages during CI/CD