frontend-build-pipeline

frontend-build-pipeline is a cursor rule for Claude Code, Cursor from eliornl/rolemule. It costs 0 tokens per session (833 once invoked), scanned A, original, MIT.

A set of rules for building a web app’s browser-side files. It combines Vite and esbuild to compile TypeScript and CSS, create hashed filenames, and let server templates find those files.

In plain words
What is it for?
Use it to define page entry files, build shared TypeScript and CSS, run type checks and tests, and connect the generated files to FastAPI templates.
Why use it?
It keeps browser code and styles consistently built and helps browsers receive updated files after a release instead of using an old cached copy.

Cursor rule for Claude CodeCursor

Written for Claude Code and Cursor: installed under .claude/, but also a Cursor rule (.mdc).

Not installable on its own: it runs a file from its repository that does not travel with it. Clone the repository, or install whatever ships that file. The line is node scripts/migrate-js-to-ts.mjs js/some-file.js.

Install

Getting it into your agent

There is no command for this one: it runs only inside a plugin, and the catalogue could not identify which plugin ships it. The source is linked below.

Made for: Claude Code, Cursor.

Wrote this? Show the measurements

A badge with what this costs and how it scanned, read live from this page, so it follows the numbers instead of freezing them. Markdown for a README, HTML for a documentation site or a project page.

agentmods badge for frontend-build-pipeline

README.md
[![agentmods](https://agentmods.dev/badge/rules/eliornl/rolemule/frontend-build-pipeline.svg)](https://agentmods.dev/rules/eliornl/rolemule/frontend-build-pipeline)
Your own site
<a href="https://agentmods.dev/rules/eliornl/rolemule/frontend-build-pipeline"><img src="https://agentmods.dev/badge/rules/eliornl/rolemule/frontend-build-pipeline.svg" alt="Measured on agentmods" height="20"></a>
Per session 0 Nothing until a file matches its globs; then the whole rule loads.
When invoked 833 The whole file, excluding the scripts and references it only reads on demand.
Security scan A 0 findings. Scan, not verified.
Origin original No closer match found in the catalogue.
Token cost

What it costs to keep this loaded

Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.

ModelPer sessionOnce invoked
Fable 5.1 $0.00000 $0.00833
Opus 5 $0.00000 $0.00417
Sonnet 5 $0.00000 $0.00167
Haiku 4.5 $0.00000 $0.00083

Measured 6d ago against content hash 9ac5a42c0559, method: parsed. Prices are Anthropic first-party input rates as of 2026-09-06, from the pricing page.

Security

Grade A, and why

frontend-build-pipeline scanned grade A with 0 findings against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured 6d ago.

A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.

Nothing flagged

None of the 26 patterns this scan looks for appear in this file: no shell pipes, no recursive deletes, no credential paths, no hidden text, no instruction-override or anti-refusal phrasing, no agent-config snooping. That is not a guarantee, it is the absence of the things that are checkable.

.claude/rules/frontend-build-pipeline.mdc · 81 lines

How it starts

The opening of the file, as written. The whole thing — 81 lines — stays where its author put it; the contents beside it link to each section on GitHub.

Frontend Build Pipeline

RoleMule uses a dual pipeline unified by ui/scripts/build-all.mjs:

  1. Legacy esbuild (ui/build.mjs) — minifies and content-hashes CSS only.
  2. Vite (ui/scripts/build-vite.mjs) — bundles each TypeScript page entry from ui/vite.entries.json as an IIFE, emits hidden source maps (.js.map on disk, no sourceMappingURL in the bundle), content-hashes JS, and writes vite-manifest.json.
  3. Merge — Vite keys override legacy keys in ui/static/dist/manifest.json.

Jinja templates still use {{ asset_url('js/...') }} / {{ asset_url('css/...') }}. FastAPI resolves hashed paths via asset_url() in main.py.

Source of truth

Kind Location
Page / global scripts ui/src/pages/*.ts (registered in ui/vite.entries.json)
Shared TS modules ui/src/shared/*.ts
CSS ui/static/css/ (still esbuild-minified)
Build output ui/static/dist/ (gitignored)

Running the Build

cd ui
npm install
npm run build          # unified: legacy + vite + merge
npm run typecheck      # tsc --noEmit
npm run test           # vitest

macOS — use Make targets (quarantine strip for node_modules binaries):

make build-frontend
make setup

Windowsjust build-frontend / just setup.

In development, asset_url() re-reads manifest.json every request when not in production — hard-refresh after npm run build.

Adding a New Page Script

  1. Create ui/src/pages/my-page.ts
  2. Add to ui/vite.entries.json: "js/my-page.js": "src/pages/my-page.ts"
  3. Reference in the template: {{ asset_url('js/my-page.js') }}
  4. Run npm run build / make build-frontend

Migrating a leftover legacy file

cd ui
node scripts/migrate-js-to-ts.mjs js/some-file.js
npm run build

asset_url()

Unchanged: production uses /static/dist/<hashed>; missing manifest falls back to /static/<path>.

Source maps (production)

Vite builds use sourcemap: 'hidden': hashed *.js.map files are written next to bundles under ui/static/dist/js/ for server-side debugging, but browsers do not auto-load them (no comment in the bundle). Do not expose /static/dist/js/*.map publicly unless you accept revealing TS source structure.

Read the full file on GitHub · 81 lines

Changes

What this file has done since we first saw it

Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.

  1. 6d ago First seen · 81 lines · 0 tokens per session scan A 9ac5a42c0559

Subscribe to this mod's changes

frontend-build-pipeline is a cursor rule published in the GitHub repository eliornl/rolemule (37 stars, last pushed yesterday), licensed MIT. It costs nothing until one of its globs matches a file; then it loads 833 tokens. A static security scan graded it A with 0 findings. No closer match exists in the catalogue, so it is treated as the original; first seen 2026-08-30.